我试图在从Vue CLI 3生成的Vue.js应用程序中使用外部sass文件(About.sass)。但是我在编译时收到有关“未知单词”的错误。
经过大量的研究,我的应用程序使用'webpack-chain',我使用'vue.config.js'来配置sass-loader。
我的配置时间表:
<style src="../sass/About.sass" scoped></style>
vue.config.js
module.exports = {
chainWebpack: config => {
config.module
.rule('sass')
.test(/\.sass$/)
.use('sass-loader')
.loader('sass-loader')
.loader('css-loader')
.loader('style-loader')
.end()
}
}
我真的被封锁了,无法让它发挥作用。我收到此错误:
ERROR Failed to compile with 1 errors 22:02:03
error in ./src/sass/About.sass?vue&type=style&index=0&id=c226fde6&scoped=true&lang=css&
Syntax Error: SyntaxError
(2:1) Unknown word
1 |
> 2 | var content = require("!!../../node_modules/vue-style-loader/index.js??ref--9-oneOf-1-0!../../node_modules/css-loader/index.js??ref--9-oneOf-1-1!../../node_modules/postcss-loader/src/index.js??ref--9-oneOf-1-2!../../node_modules/sass-loader/lib/loader.js??ref--9-oneOf-1-3!./About.sass?vue&type=style&index=0&id=c226fde6&scoped=true&lang=css&");
| ^
3 |
4 | if(typeof content === 'string') content = [[module.id, content, '']];
任何帮助或建议?提前致谢。
似乎我忘了在标签lang="sass"
中指定类型<style src="../sass/About.sass" scoped></style>
Vue非常聪明,可以配置加载器,因此甚至不需要'vue.config.js'。