webpack -- webpack安装

一、新建项目

mkdir projectName

切换到项目里面

cd projectName

二、初始化项目

npm init -y

三、安装webpack

不推荐全局安装

npm install webpack --save-dev

// npm install webpack -g

四、安装webpack-cli

如果是webpack 4.0及以上版本，在安装webpack的同时还需要安装webpack-cli

npm install webpack-cli --save-dev

五、配置package.json

1、配置私有安装包

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

2、配置浏览器支持

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

3、配置npm scripts

在scripts对象里面添加一个生产命令

// 这个配置是为后面打包用的，可以运行npm run build
scripts: {
    "build": "webpack"
}

六、安装lodash

这一步不是必须的

npm install lodash --save

七、创建配置文件

在根目录下新建一个webpack.config.js文件

八、创建src

在src文件下面新建一个index.js文件，此时就可以通过npx webpack命令，来默认将src/index.js作为入口文件，输出到dist下的main.js文件
Tips
这里因为是一步步配置的，所以不需要npm install来初始化安装依赖包，因为package.json里面啥也没有