如何使用webpack导入min文件

Question

我正在尝试从webpack的文件夹中导入第三方min js和min css，但我找不到webpack的这个文件夹。

我的结构是

-node_modules
-src
-lib
  -min.js
  -css
    -min.css

但是我无法识别这个lib文件夹。我在webpack.config.js

上尝试了别名

resolve: {
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      'lib': './lib/'
    }
  },

我尝试过resolve.modules：

resolve: {
    modules: [path.resolve(__dirname, "lib")],
    alias: {
      'vue$': 'vue/dist/vue.esm.js',
    }
  },

但是效果不好。我做错了什么？

Answer 1

您只需在已包含的*.js个文件中引用这些文件。

假设以下结构：

-node_modules

-src
    -app.js

-lib
  -min.js
  -css
    -min.css

并且项目的入口点是./src/app.js，在那里添加以下两行代码：

<强> app.js：

＆＃13;

＆＃13;

import { min } from '../lib/min.js'
import '../lib/css/min.css'

＆＃13;

＆＃13;

＆＃13;

那就是它！ Webpack将负责这些库和样式表。 如果您需要了解有关所需 webpack加载器的更多信息以及如何提取样式文件，请参阅我之前的回答here。