webpack——1

写在前面：

为什么开始这种类型的笔记？

最主要原因是想做个简洁的笔记

每次把笔记和code混在一起，很杂，有许多无用的东西

这样，都是干货

 

1.li 奇偶行颜色不同

// 1.index.html （不需要写任何script）

但需要导入<script src="../dist/bundle.js"></script>
// 2.main.js
// 引入jquery  写逻辑代码$()

（import $ from 'jquery'  以及 npm i jquery -S）
// 3.安装完webpack后 init初始化 --》package.json
// 4.命令行输入webpack ./src/js/main.js ./dist/bundle.js
// 会出现bundle.js
// 

5.只敲击webpack

（<script src="../dist/bundle.js"></script>        ------------------这句话还在）

配置webpack.config.js

const path = require('path')

写entry  output

6.自动打包编译

cnpm install webpck-dev-server -D

（和 cnpm i webpck-dev-server --save-dev 好像一样）

(安装到项目本地开发依赖)

7."scripts":"webpack-dev-server"

(package.json)

这时 webpack-dev-server 或者 npm run dev均可

并且

webpack-dev-server 依赖webpack，所以   npm install webpack --save-dev

8.

http://localhost:8080/bundle.js  

9.

每修改一次"scripts":"webpack-dev-server"都要 npm run dev

10.

异步刷新页面对js没有效果

--hot：

网页不重载，就是不刷新 以及 打补丁，不用把那个文件整个打包

11.

contentBase 内容根路径

12.

npm install webpack --save-dev

npm uninstall webpack -g