webpack -- webpack安裝

1、新建項目

mkdir projectName

切換到項目裏面

cd projectName

2、初始化項目

npm init -y

3、安裝webpack

不推薦全局安裝

npm install webpack --save-dev

// npm install webpack -g

4、安裝webpack-cli

若是是webpack 4.0及以上版本，在安裝webpack的同時還須要安裝webpack-cli

npm install webpack-cli --save-dev

5、配置package.json

一、配置私有安裝包

去掉package.json文件裏面的"main":"index.js"，添加"private": true

二、配置瀏覽器支持

browserslist: [
    'defaults',
    'not ie < 8',
    '> 1%',
    'last 2 versions',
    'IOS 7',
    'IOS last 3 versions'
]

三、配置npm scripts

在scripts對象裏面添加一個生產命令

// 這個配置是爲後面打包用的，能夠運行npm run build
scripts: {
    "build": "webpack"
}

6、安裝lodash

這一步不是必須的

npm install lodash --save

7、建立配置文件

在根目錄下新建一個webpack.config.js文件

8、建立src

在src文件下面新建一個index.js文件，此時就能夠經過npx webpack命令，來默認將src/index.js做爲入口文件，輸出到dist下的main.js文件 Tips 這裏由於是一步步配置的，因此不須要npm install來初始化安裝依賴包，由於package.json裏面啥也沒有