這篇文章將為大家詳細講解有關Autoprefixed怎么在vue中使用，文章內容質量較高，因此小編分享給大家做個參考，希望大家閱讀完這篇文章后對相關知識有一定的了解。

創(chuàng)新互聯(lián)建站是一家專業(yè)提供岢嵐企業(yè)網(wǎng)站建設,專注與網(wǎng)站設計制作、成都網(wǎng)站設計、H5開發(fā)、小程序制作等業(yè)務。10年已為岢嵐眾多企業(yè)、政府機構等服務。創(chuàng)新互聯(lián)專業(yè)網(wǎng)絡公司優(yōu)惠進行中。

安裝依賴包

如果你是使用vue-cli構建的項目。首先執(zhí)行以下代碼安裝依賴包。

npm install autoprefixer postcss postcss-loader -D

修改vue-loader配置文件

修改目錄/build/vue-loader.conf.js文件。文件的原本代碼應該如下。

module.exports = {
 loaders: utils.cssLoaders({
  sourceMap: isProduction
   ? config[buildEnv].productionSourceMap
   : config.dev.cssSourceMap,
  extract: isProduction
 })
}

將以上代碼，替換成如下代碼。

module.exports = {
 loaders: utils.cssLoaders({
  sourceMap: isProduction
   ? config[buildEnv].productionSourceMap
   : config.dev.cssSourceMap,
  extract: isProduction
 }),
 postcss: [require('autoprefixer')({browsers: ['last 10 Chrome versions', 'last 5 Firefox versions', 'Safari >= 6', 'ie > 8']})]
}

修改utils

打開/build/utils.js，定位到如下代碼。

postcss: generateLoaders()

將上面的代碼更改為如下代碼。

postcss: generateLoaders(['css?-autoprefixer'])

關于Autoprefixed怎么在vue中使用就分享到這里了，希望以上內容可以對大家有一定的幫助，可以學到更多知識。如果覺得文章不錯，可以把它分享出去讓更多的人看到。