webpack4把webpack-cli从全局安装中抽取出来,所以使用webpack时除了全局安装之外,还需要安装webpack-cli,不然在后面无法使用webpack命令打包文件;安装的具体操作如下:
- 使用命令行安装全局webpack:npm i -g webpack,等待片刻,安装完成之后如下显示
- 使用命令行安装webpack-cli:npm i -g webpack-cli,安装完成如下显示:
webpack旧版本使用的打包命令是:webpack <需要打包的文件名称> <打包之后的文件>
但是在webpack4之后,旧版本的打包命令无法正常使用,需要使用一下的命令打包:
webpack <需要打包的文件名称> --output-filename <打包之后的文件> --output-path . --mode development
如果每次修改都要使用命令行打包就会很麻烦,可以使用在打包命令后面添加--watch来监听文件的修改,每次文件有改动,系统都会自动更新
在使用webpack.config.js文件打包时,命令行出现以下错误可以把webpack.config.js中的module中的loaders修改为rules,再重新构建就能成功了!
Invalid configuration object. Webpack has been initialised using a configuration object that does not match the API schema.
- configuration.module has an unknown property 'loaders'. These properties are valid:
object { defaultRules?, exprContextCritical?, exprContextRecursive?, exprContextRegExp?, exprContextRequest?, noParse?, rules?, strictExportPresence?, strictThisContextOnImports?, unknownContextCritical?, unknownContextRecursive?, unknownContextRegExp?, unknownContextRequest?, unsafeCache?, wrappedContextCritical?, wrappedContextRecursive?, wrappedContextRegExp? }
-> Options affecting the normal modules (`NormalModuleFactory`).