-
template:將dist下的html文件和根目錄下的html文件聯(lián)系起來(lái)
<script src="<%= %>"></script>
htmlWebpackPlugin.files.chunks.main.entry
拿到被打包后的main文件的路徑
查看全部 -
minify 屬性對(duì)當(dāng)前文件進(jìn)行壓縮
查看全部 -
output: [name] [hash] [chunkhash]
查看全部 -
在 webpack.config.js中的"scripts"中添加
"webpack": "webpack --config webpack.config.js --progress --display-modules --colors --display-reason"
查看全部 -
npm install html-webpack-plugin --save-dev,這個(gè)插件用來(lái)解決html中引用的文件名稱(chēng)為隨機(jī)的時(shí)候,自動(dòng)生成與之對(duì)應(yīng)的隨機(jī)文件名稱(chēng)。Easily?create?HTML?files?to?serve?your?bundles
webpack.config.js
plugins:[
???? new htmlWebpackPlugin({
? ?????? filename: 'asset/index-[hash].html',
???? ? ? ? template: './src/index.html',
???? ? ? ?inject: 'head'
? ? ?})
]
查看全部 -
在pageage.json中scripts
"webpack": "webpack --config webpack.config.js --progress --display-modules --colors --display-reason"
然后就可以用npm run webpack來(lái)運(yùn)行了
查看全部 -
不同于其他打包工具:
代碼分割
插件系統(tǒng)
模塊熱更新
查看全部 -
安裝less-loader之前要安裝less,處理less就要安裝less-loader,sass-loader
查看全部 -
postcss-loader 就是可以插入css的插件 postcss 有很多的插件
查看全部 -
0705webpack查看全部
-
webpack
查看全部 -
webpack --config webpack.dev.config.js
查看全部 -
在一個(gè)新的文件夾下面
npm init ? 初始化 (參數(shù)默認(rèn))
npm install webpack ?(在文件夾下面裝webpack)
查看全部 -
shell命令使用webpack需要在項(xiàng)目中安裝webpack-command
module.exports?=?{ ????entry:'./src/script/main.js', ????output:?{ ????????path:'./dist/js', ????????filename:'boundle.js' ????} }
這邊報(bào)錯(cuò):由于path的路徑不是正確的絕對(duì)路徑
改成這樣:
var?path?=?require('path') module.exports?=?{ ????entry:'./src/script/main.js', ????output:{ ????????path:path.resolve(__dirname,'./dist/js'), ????????filename:'boundle.js' ????} }
查看全部 -
npm init
npm install webpack --save-dev 安裝webpack
webpack 原文件名 編譯后的文件名
require('style-loader!css-loader!./style.css') 給文件類(lèi)型指定一種loader方式
'style-loader' 使html能夠引入css文件
'css-loader' 使webpack能夠編譯css文件
webpack hello.js hello.bundle.js --module-bing 'css=style-loader!css-loader' --watch 命令行中綁定loader方式
查看全部
舉報(bào)