vue导入全局css_vue中定义并引入全局css或者less文件

最近使用vue开发的时候遇到了一个很棘手的问题 由于组件很多 在路由的时候会发生样式错乱 后来查了一下 是因为没有给每个组件里的style加scoped属性

我加上了之后 确实可以解决这个问题 但是项目里难免需要用到一些插件 问题就是加了scoped属性之后 这些插件的样式就不生效了 我也改不了插件的样式

研究了一下 估计应该是需要弄个全局的less文件 在这个文件里定义全局样式 但是问题是我该怎么引入这个全局的样式文件呢 因为我是把这个文件放在了src/assets/less目录下 如果我是在组件的style里引入肯定不行 因为style已经加了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"

}

]

}