-
webpack.config.js module.exports={ entry:"./js/hello.js", output:{ path:'./dist/js', filename:'bundle.js' } } //打包代碼 webpack --config webpack.config.js --progress --display-modules --colors --display-reason --module-bind 'css=style-loader!css-loader' --watch //路徑問題 var path = require('path') output: { path: path.resolve(__dirname, './dist'), filename: 'js/[name].bundle.js' },查看全部
-
npm install css-loader style-loader --save-dev webpack --module-bind 'css=style-loader!css-loader' --watch查看全部
-
postcss-loader引用， import引用外部css同時使用postcss兼容，需要在css-loader傳參查看全部
-
babel配置查看全部
-
嵌入(inline)js腳本查看全部
-
publicPath:引用線上地址查看全部
-
htmlWebpackPlugin查看全部
-
url-loader配合query將圖片編碼成base64查看全部
-
在html或CSS中用圖片時可以直接寫相對路徑，但在模板中引用圖片時需要用絕對路徑，而用相對路徑要這樣：<img src="${require('../../assets/bg.png')}"/>查看全部
-
如果樣式文件不是CSS，而是less或scss則不用寫importLoaders=1便可直接將樣式字段補全，也可將樣式嵌套引入查看全部
-
如果CSS中又引入了CSS，需要在postcss-loader前加importLoaders=1值為引入的CSS的個數查看全部
-
有關CSS的loader，要注意順序查看全部
-
配置文件理解： var path = require('path'); module.exports={ entry:'./src/script/main.js',//入口文件需要寫絕對路徑 output:{ path:path.resolve(__dirname,'./dist'), filename:'bundle.js' } } // 引用文件需要寫絕對路徑 建議學習webpack之前學習一下node.js path.resolve(__dirname,src)翻譯過來也就是重新定義路徑，里面放兩個參數。目前我的理解第一個參數是原始的路徑值也就是main.js的路徑，因為__dirname（英文輸入法兩個下劃線）代表著模塊的絕對路徑，所以entry里面的路徑是絕對路徑，如果去掉./則無法解析。不過目前無法理解用entry路徑替換__dirname卻無法解析。 第二個參數便是打包之后存儲的路徑地址。查看全部
-
moudle-bind查看全部
-
遍歷插件查看全部
舉報
0/150
提交
取消