引入css别名报错

Question

vue.config.js在根目录配置如下
引入@com正常显示
只要引入@css样式报错

看着像是某个依赖没有找到

Answer 1

Sunday 2020-03-04 11:01:28

你好：

@import 语法是 scss 所提供的一个语法 ， 当使用该语法时，是不可以用来引入 css 文件的 。 

首先你需要把 style 的lang 改为scss ， 然后再使用 @import 语法来引入  scss 的文件

• 提问者 haohao809 #1

  @import 'assets/css/reset.css';这样不使用别名的话，就不会报错，可以引入的

• Sunday 回复 提问者 haohao809 #2

  你好：
  这个其实就是因为 webpack 中 css-loader 和 sass-loader 的一个 @import 语法问题。
  
  如果你直接通过 @import 引入一个 css 文件，那么其实使用的是 css-loader ，而对于 css-loader 来说他是不允许使用 alias 来指定一个路径的，它只可以使用绝对路径或相对路径，也就是@import 'assets/css/reset.css';这种。
  
  而如果是引入 scss 文件，那么就是使用的 sass-loader ，那么它是支持使用 alias 这种方式来引入一个 scss 的文件的。

• 提问者 haohao809 #3

  非常感谢！