vue调用style-loader报错

vue使用style-loader将css样式添加到DOM中报错

ERROR in ./src/css/normal.css
Module build failed: CssSyntaxError

(1:1) Unknown word

> 1 | var content = require("!!./normal.css");
    | ^
  2 | 
  3 | if (typeof content === 'string') {

 @ ./src/main.js 11:0-27
npm ERR! code ELIFECYCLE
npm ERR! errno 2
npm ERR! meetwebpack@1.0.0 build: `webpack`
npm ERR! Exit status 2
npm ERR!
npm ERR! Failed at the meetwebpack@1.0.0 build script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

可能是你在webpack.config.js文件中配置的loader顺序出错
原代码

const path=require('path')
module.exports={
  entry: './src/main.js',
  output: {
    path:path.resolve(__dirname,'dist'),
    filename:'bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ['css-loader','style-loader']
      },

    ]
  }
}

改过之后代码

const path=require('path')
module.exports={
  entry: './src/main.js',
  output: {
    path:path.resolve(__dirname,'dist'),
    filename:'bundle.js'
  },
  module: {
    rules: [
      {
        test: /\.css$/,
        use: ['style-loader','css-loader']
      },

    ]
  }
}

这是因为配置多个loader时，程序是从右往左读取的