全域性安裝
npm install webpack -gnpm install webpack webpack-cli webpack-dev-server -d在package.json的scripts中新增以下**
如果webpack.config.js在根目錄可以省略，為預設，如果在自己自定義的資料夾下，需要配置路徑
"scripts":
輸入npm run dev就可以開啟node支援下webpack伺服器
入口：entry
當只有乙個js檔案被作為入口時
entry: './src/index.js'let str = require('./test.js');如果輸出是乙個檔案，即合併，可以用陣列的方式
entry: ['./src/index.js','./src/test.js'],entry: ,path作為輸出路徑，[hash:8]只是為了名稱不重複，解決快取問題
輸出乙個檔案
output:output:外掛程式目的在於解決 loader 無法實現的其他事 —webpack中文網
比如：打包html檔案
const htmlwebpackplugin = require('html-webpack-plugin'); //通過 npm 安裝
plugins:[
new htmlwebpackplugin(
}),]
清除檔案該外掛程式作為清除生成的dist檔案，防止帶有hash值的檔案無法被替代，從而造成過多的檔案，該外掛程式的新版不需要傳入引數
const cleanwebpackplugin = require('clean-webpack-plugin');
plugins: [
new cleanwebpackplugin();
]
const webpack = require('webpack'); // 先引入webpack
plugins: [
new webpack.hotmodulereplacementplugin();
] devserver:
devserver:module:,,,
]},,,
] }
]
resolve: ，
// extensions是在匯入含該字尾名的檔案時，是否可以省略字尾名
extensions: ['.tsx', '.ts', '.js']
}
webpack基本配置
demo及筆記 前端構建工具webpack的學習 什麼是webpack？webpack可以做什麼？1.優化 刪除多餘的冗餘 壓縮 2.轉換 jsx，es6，es6的語法轉換，less，sass等預編譯處理器的轉換 3.打包 合併多餘檔案，減少請求次數，加快響應 4.devserver 解決跨域問題。...
webpack基本配置
1 context context path.resolve dirname,js 配合entry，含義是從當前專案目錄下的js檔案下查詢入口檔案基本目錄，絕對路徑，用於從配置中解析入口起點和載入器。2 entry entry js main.js 應用程式的起點入口，從這個起點開始，應用程式啟動執...
webpack基本配置
一 新建專案 二 包管理管理專案 npm init y 當建立的專案根目錄名稱是中文或者包含中文，就不能使用 y 命令 直接使用 npm init 之後會讓你手寫專案名稱 keywords author license isc 生成了 package.json 檔案，該檔案集中管理了專案中所用到的包...