url：c:\users\27509\desktop\kaikeba\demo_webpack
工具：1.編譯類-babel
es6->es5
2.打包-browserify
一堆檔案->單個檔案
3.開發輔助-browser-sync
多端同步
4.測試類
單元測試:模組，函式
整合測試
壓力測試：效能，負載能力，隱藏bug
webpack+外掛程式
打包，編譯，測試，除錯
編寫配置
預設：webpack.config.js
修改：es6模組化
export default *** //作為模組本身被輸出 import *** from "..."
export let a=1,b=2 //輸出模組的東西 import from "..."
webpack基本配置
module.exports=
}單入口
entry:"入口檔案位址"
多入口entry:
output:
dev-server
1.安裝
cnpm i webpack webpack-cli webpack-dev-server -d
webpack-cli 命令列工具
npm i -g webpack
webpack 庫
npm i webpack
devserver
開發伺服器
loader-翻譯
babel-loader
1.babel-loader 給webpack用的
1.babel-core babel核心庫
1.babel-preset-env 環境預設
cnpm i babel-loader babel-core babel-parset-env -d
百分之90的loader
module:]}
1.打包-》配置
2.devserver
3.各種loader
resolve:
webpack相關配置
webpack相關配置 var path require path var webpack require webpack 啟用熱更新第二步 匯入在記憶體中生成 html 的外掛程式,只要是外掛程式就一定要放在plugins中去 var htmlwebpackplugin require html ...
webpack相關配置
由於webpack是基於nide構建的，所有在配置檔案時，任何合法的node 都是支援的 1.匯入路徑模板 const path require path 匯入在記憶體中生成html頁面的外掛程式 const htmlwebpackplugin require html webpack plugin...
webpack相關配置
webpack相關配置 var path require path var webpack require webpack 啟用熱更新第二步 匯入在記憶體中生成 html 的外掛程式,只要是外掛程式就一定要放在plugins中去 var htmlwebpackplugin require html ...