鍍金池/ 問答/HTML/ vue中定義并引入全局css或者less文件

vue中定義并引入全局css或者less文件

最近使用vue開發(fā)的時候遇到了一個很棘手的問題 由于組件很多 在路由的時候會發(fā)生樣式錯亂 后來查了一下 是因為沒有給每個組件里的style加scoped屬性
我加上了之后 確實可以解決這個問題 但是項目里難免需要用到一些插件 問題就是加了scoped屬性之后 這些插件的樣式就不生效了 我也改不了插件的樣式
研究了一下 估計應(yīng)該是需要弄個全局的less文件 在這個文件里定義全局樣式 但是問題是我該怎么引入這個全局的樣式文件呢 因為我是把這個文件放在了src/assets/less目錄下 如果我是在組件的style里引入肯定不行 因為style已經(jīng)加了scoped 如果是在script引入 它會報錯 script里引入樣式文件 估計是只能引入node_modules里面的
這該怎么解決呢
import 'assets/less/global.less'

module: {

rules: [{
    test: /\.vue$/,
    loader: 'vue-loader',
    options: vueLoaderConfig
  },
  {
    test: /\.js$/,
    loader: 'babel-loader',
    include: [resolve('src'), resolve('test')]
  },
  {
    test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: utils.assetsPath('img/[name].[hash:7].[ext]')
    }
  },
  {
    test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: utils.assetsPath('media/[name].[hash:7].[ext]')
    }
  },
  {
    test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,
    loader: 'url-loader',
    options: {
      limit: 10000,
      name: utils.assetsPath('fonts/[name].[hash:7].[ext]')
    }
  },
  {
    test: /iview.src.*?js$/,
    loader: 'babel-loader'
  },
  {
    test: /\.js$/,
    loader: 'babel-loader',
    exclude: /node_modules/
  },
  {
    test: /\.less$/,
    loader: "style-loader!css-loader!less-loader"
  }
]

}
圖片描述

回答
編輯回答
病癮

在main.js里直接import '../xx.less'
所有的全局樣式都可以在這引入。

2018年1月2日 15:31
編輯回答
不討囍

該死有點(diǎn)擊這個sb網(wǎng)站, sass-resources-loader 這個了解一下。

2017年2月25日 11:00