技術科普

webpack4.0使用

2018-06-25 20:41:29 66

webpack-cli從webpack包里面分離出來了,所以需要自己安裝啦!具體報錯是這樣的:

$ npx webpack src/index.js --output dist/bundle.js
npx: 1 安裝成功,用時 26.36 秒
Path must be a string. Received undefined
C:\Users\Administrator\Desktop\webpack\webpack02\node_modules\webpack\bin\webpack.js
The CLI moved into a separate package: webpack-cli.
Please install 'webpack-cli' in addition to webpack itself to use the CLI.
-> When using npm: npm install webpack-cli -D
-> When using yarn: yarn add webpack-cli -D

所以需要根據它的提示安裝一個webpack-cli
npm install webpack-cli -D
上面還提示我沒有找到webpack.js,我明明就安裝過了,不知道到底為啥,所以一激動就把webpack卸掉了,就像這樣:
npm uninstall webpack
然后在安裝了一次
npm i -D webpack
再執行
npx webpack —config webpack.config.js
或者在package.json文件中添加
“scripts”: {
“build”: “webpack”
},
執行npm run build
然后就可以了
不得不說的是還有一個警告,雖然目前沒有太大的影響,但是看著不舒服,這也是webpack4.0新增加的,警告如下:
WARNING in configuration
The ‘mode’ option has not been set. Set ‘mode’ option to ‘development’ or ‘production’ to enable defaults for this environment.
這個主要是因為你mode這個屬性,mode選項可以在webpack.config.js里指定,也可以在webpack cli命令上指定:
配置文件:
mode: ‘development’
mode: ‘production’

命令行:
webpack —mode development
webpack —mode production

development:開發模式,webpack會默認配置常用于開發的參數,如輸出運行時的錯誤信息等
production:產品模式,webpack會默認配置常用語產品構建的餐宿,如壓縮代碼等
module.exports = {
mode: ‘development’,
entry: ‘./src/index.js’,
output: {
filename: ‘bundle.js’,
path: path.resolve(__dirname, ‘dist’)
}
};
這樣就好啦!
繼續研究,有啥重點繼續更新!!!

江苏11选5分析网站