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:

plungin裡面新增　　new webpack.hotmodulereplacementplugin()

入口檔案更新：　　　

if (module.hot)