webpack

webpack基本配置

1、安装node.js

打开cmd 运行node -v\npm -v 是否可以查看文件版本信息？

2、在某磁盘中创建空文件夹，例如：e:\webpack\webpack-test

3、使用vsCode工具中打开e:\webpack\webpack-test---------并打开终端

4、在终端中执行npm init 命令行，生成package.json文件

5、执行 npm install webpack --save-dev 命令行
node_modules\package-lock.json文件并在package.json文件中多一项配置

6、执行 npm install webpack-dev-server --save-dev 命令行，在package.json文件中多一项配置

7、执行 webpack -v 命令，检查webpack的版本
Webpack 4.x由于有兼容性问题，可以使用命令行npm i webpack@3.6.0 -g进行降级
再次执行 webpack -v 需要安装webpack cli,
并在package.json文件中生成配置信息：
再次执行webpack -v 命令，这时就是webpack 3.x

8、创建webpack.config.js 文件

9、在package.json的scripts里面添加webpack-dev-server服务脚本

10、创建main.js文件

11、创建index.html 文件

12、在项目目录下创建src文件夹，在src下创建index.js空文件；项目结构

13、在package.json文件中插入一条启动配置

14、最后执行：npm run dev 命令行，打开浏览器入口，并自动打包生成dist\main.js