webpack 项目记录

XXX项目记录

 

• Webpack管理项目

 

1. 新建一个文件夹，用来创建项目，cmd 进入该文件夹。（需node.Js）.
2. 执行npm init 命令，接下来就是一系列项目资料，直接回车就可以跳过了。完成时候会在该文件夹下生成 package.json文件。

 

1. 安装 webpack
2. 

1. 首先要全局安装 webapck,  执行npm install webpack -g。

1. 然后再在工作目录中执行 npm install wepack --save-dev,安装webpck。

 

 

1. 项目根目录下新建一个webpack.config.js 和 .gitignore

 

1. .gitignore文件用来配置 忽略文件如：我们在打包是不许需要打包 node_modules,做如下配置。

 

 

1. 配置开发所需的loader和 plugin插件
2. npm install --save-dev css-loader style-loader sass-loader  postcss-loader autoprefixer
3. npm install --save-dev babel-core babel-preset-es2015 babel-loader
4. npm install --save-dev url-loader
5. npm install --save-dev html-webpack-plugin
6. npm install --save-dev clean-webpack-plugin
7. npm install --save-dev copy-webpack-plugin
8. npm install  --save-dev extract-text-webpack-plugin@next（webpack4x不支持该插件，所以使用@next; 已经被mini-css-extract-plugin所替代 ）

 

 

 

 

1. 配置webpack.config.js, favicon.ico应放在根目录下

 

 

 

 

9.package.json 中配置开发环境和生产环境