6-23
#output: {
path: './dist',
filename: 'js/[name].js'
},
module: {
loaders: [
// 圖片
{
test: /\.(woff|woff2|eot|ttf|svg|jpg|png)(\?[a-z0-9]+)?$/,
loader: 'url-loader?limit:1000&name=resourse/[name].[ext]'
}
]
},
我需要將圖片變成base64 這一點成功了.後面的'name=resourse/[name].[ext]',應(yīng)該會在dist目錄下產(chǎn)生一個resourse的資料夾,然後裡面會有圖片.但是並沒有生效...
6-24 繼續(xù)修改發(fā)現(xiàn)更尷尬了
先上兩張圖分別是webpack1裡面介紹的loader用法和url-loader的參數(shù)
然後請大家看看我的webpack.config.js
{
test: /\.(woff|woff2|eot|ttf|svg|jpg|png)(\?[a-z0-9]+)?$/,
loader: 'url-loader',
query: {
limit: 100
}
}
執(zhí)行webpack居然報錯 說沒有找到file-loader
ERROR in ./src/image/song.jpg
Module build failed: Error: Cannot find module 'file-loader'
at Function.Module._resolveFilename (module.js:469:15)
這裡跟file-loader有什麼關(guān)聯(lián)??那就 cnpm i --save-dev file-loader吧.
居然webpack成功了.
那我繼續(xù)修改程式碼
{
test: /\.(woff|woff2|eot|ttf|svg|jpg|png)(\?[a-z0-9]+)?$/,
loader: 'url-loader',
query: {
limit: 100,
name: 'resourse/[name].[ext]'
}
}
運行webpack 然後繼續(xù)成功.而且也產(chǎn)生了resourse目錄.
#雖然最好問題解決了但是還是搞不懂這根他媽的file-loader 有什麼關(guān)係.在url-loader的官網(wǎng)上,並沒有看到必須要裝file-loader的說明.
小伙看你根骨奇佳,潛力無限,來學(xué)PHP伐。
{
test: /\.(woff|woff2|eot|ttf|svg|jpg|png)(\?[a-z0-9]+)?$/,
loader: 'url-loader',
options: {
limit: 1000,
name: 'resourse/[name].[hash:7].[ext]'
}
}
那換種方式這樣來吧。 。我很少用拼接的方式 不太記得了