我使用vue-cli搭自己的博客，希望引入公共樣式：
// main.js import './assets/styles/common.css' 我本來是希望webpack打包后，能將這個樣式獨立打包，在生成的html文件中用<link href='/static/css/common.css'>這樣的形式引入，這樣瀏覽器就能緩存，各個頁面需要的話就import一下，也不用重新加載了，可是誰知道，webpack將我的common.css文件打包到了app.css中，混到一起了，這樣還復用個毛啊。。。build/webpack.base.conf.js中有開關，能啟用extract-text-webpack-plugin插件，我試過啟用
// vue-loader.conf.js module.exports = { loaders: utils.cssLoaders({ sourceMap: sourceMapEnabled, extract: true // 這兒原本是isProduction，我給修改成true，打開extract開關 }), ... } // webpack.base.conf.js plugins: [ new ExtractTextWebpackPlugin('common.css') ]然而並沒有什么卵用，還是把我的common.css混到app.css中了。。。（下圖為npm run build后得到的css文件）
那么問題來了，挖掘，哦不對,是怎么配置webpack，才能實現：組件中以import引入css文件，該css文件獨立打包，並以在生成的<link href='******'>的形式引入呢？
如果你不想被打包，那就沒必要在js中引入了，直接在index.html頁面上<link href='******'>就好，對於大小而言，請求兩個單獨css文件，可能比單獨請求一個合並的css文件消耗更大的帶寬，而且增加了網絡請求數量，所以上線階段合並是更好的選擇。上線版應該側重點於減少網絡請求量，提升加載速度，開發版才應該側重於代碼美觀。