webpack知識点

現在のweb開発が直面している苦境1.ファイル依存関係が複雑になっている2.静的資源要求の効率が低い3.モジュール化サポートが友好的ではない4.ブラウザは高級JavaScriptの特性互換性が低いwebpack概説webpackは流行の構築ツールであり、web開発が直面する苦境を解決することができる.利点:1.フレンドリーなモジュール化サポートを提供します.コード圧縮混淆3.js対応問題を処理します.4.性能最適化webpackの基本使用1初期化項目を作成します.2.npm install webpack-cil-dコマンドを実行します.webpack関連のパッケージをインストールします.2.ルートディレクトリでは、webpack.co.fig.jsというwebpackプロファイルを作成します.3.packプロファイルは、設定されます.(developmentは圧縮のためにコード化過程でこれを使ったらもっと良いコンパイルができますが、オンラインではprodctionに変更します)

module.expoets = {
	mode:'development' //mode        
}

4.package.jsonプロファイルの中のscriptsノードで、スクリプトを追加します.

"scripts":{
	"dev":"webpack" //script      ，     npm run   
}

5.端末でnpm run devコマンドを実行し、webpackを起動してプロジェクトを梱包する
webpackパッケージの人口と輸出webpackの4.xバージョンでデフォルトの約束を設定します.

エントランスファイルはsrc->index.js

です.

出力ファイルはdist->main.jsです.パッケージの入り口と出口を変更するなら、webpack.co.nfig.jsに以下のような設定情報を追加できます.

module.expoets = {
	mode:'development', //mode        
	entry:'       ',
	output:{
		path:'       ',
		filename:'bundle.js' //      
	}
}