webpack基础知识，笔记

webpack是一个打包工具，通常一个js认为是一个模块，webpack默认只能识别js文件，若是要打包其余的如图片，txt，css等就须要使用loader。loader告诉webpack如何去打包对应的文件

样式loader：写css的方法有不少，less，scss，stylus最多见，每一种方法打包的时候须要3个loader，用stylus举例,它须要3个loader：stylus-loader css-loader stylus-loader,各自做用：

style-loader：把css挂在到dom上

css-loader：处理css

styus-loader：处理styus，转化为css

devtool：报错提示，能够很清楚的定位到错误行数以及该行内的第多少字符。开发环境建议用 cheap-module-eval-source-map ，报错能够定位到本地原始(打包以前)代码的文件以及行数，由于要准肯定位到某个字符会消耗性能，因此建议定位到错误的行数就能够

热更新：

　　先安装　　npm install webpack-dev-server -D

　　而后在package.json里面修改命令　　"dev": "webpack-dev-server"

　　引入webpack　　const webpack = require("webpack");   // 为了使用hmr

　　添加配置项

　　　　devServer: {

　　　　  contentBase: './dist'，

　　　　  hot: true,

　　　　  hotOnly: true, // hmr不生效的时候也不让页面刷新

　　　　}

　　Plungin里面添加　　new webpack.HotModuleReplacementPlugin()

　　入口文件更新：　　　

　　　　if (module.hot) { 　　　　  module.hot.accept('）// 利用这个方法来更新代码修改以后对应页面的修改　　　　}