vue main.js引入scss报错

Question

1.样式目录结构是这样的

2.index.scss文件内容是这样的

3.在main.js的内容是这样的

import Vue from 'vue'
import App from './App'
import router from './router'

import './common/style/index.scss';

fastclick.attach(document.body)

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: { App }
})

4.报错内容：

error in ./src/common/style/index.scss
Module build faild:
body{
^
    Invalid CSS after "...load the styles": expected 1 selector or at-rule,was"var content = requi" in D:\lottery\src\common\style\index.scss(line 1,column 1)

Answer 1

在.vue和.js文件中使用对应的cssload解析就可以了。你用的是sass那就需要先安装：
//在项目下，运行下列命令行，sass-loader依赖于node-sass，所以还要安装node-sass
npm install --save-dev sass-loader node-sass

然后在对应的配置module中配上对应的loader

Answer 2

在App.vue中引入你的scss文件，就可以了，类似这样

<style lang="scss">
  @import './assets/style/main.scss'
</style>