这是我参与8月更文挑战的第15天,活动详情查看:8月更文挑战
我们已经知道,webpack
会自动使用名为 webpack.config.js
的配置文件,那如果我们的配置文件并不叫 webpack.config.js
,而是叫其它的名字呢?
- 比如我们将
webpack.config.js
修改成了wk.config.js
; - 这个时候我们可以通过
--config
来指定对应的配置文件;
我们可以先来测试一下,首先把 webpack.config.js
修改为 wk.config.js
,然后在命令行终端中执行 npm run build
命令(注意,当前 package.json
文件中脚本 "build"
的内容为 "webpack"
),结果如下:
可见,运行报错了,没有成功打包。这是为甚莫呢?原因非常的简单哈,因为默认情况下,webpack
进行打包时,当我们执行 npm run build
命令时,会找到 package.json
文件中 "scripts"
里我们自己定义的 "build"
这项脚本里的命令(这里也就是 “webpack
” 命令啦~不过和直接在命令行中执行 webpack
的区别在于,package.json
里配置的脚本命令 webpack
在执行时会优先使用局部安装的(当前项目中的)webpack
,如果没有局部安装的 webpack
,则会使用全局安装的 webpack
,而直接在命令行中执行 webpack
,则会直接使用全局安装的 webpack
哈),接下来,会先查看当前文件夹下面是否存在名为 webpack.config.js
的文件,如果有,则会根据这个文件里的配置开始执行相关的编译过程,如果没有,则依然会去寻找当前文件夹下的 src
文件夹下的 index.js
文件。但是我们这里已经把 src
目录下的 index.js
改名为了 main.js
了,所以最后就找不到 index.js
文件,因此才会出现上图中的报错。
但事实上,我们是有配置文件的,只是它的名字不叫 webpack.config.js
,而是叫 wk.config.js
,甚至后面我们还会把很多配置文件都放在一个文件夹下(比如叫 config
的文件夹),那这时我们该如何指定某个文件为 webpack
的配置文件呢?
来,我们去查阅下文档:
可以看到,通过 --config
可以指定 webpack
的配置文件,那么,我们就可以这样做了:修改 package.json
文件中 "scripts"
里的 "build"
一项的内容为 "webpack --config ./wk.config.js"
(这里也可以不加 ./
),如图:
再执行 npm run build
,就能正常编译打包了。