问题描述
我正在尝试在 vue3 应用程序中使用 scss。我收到以下错误。
./src/components/SinglePost.vue?vue&type=style&index=0&id=164ef990&lang=scss (./node_modules/css-loader/dist/cjs.js??ref--8-oneOf-1-1!./node_modules/vue-loader-v16/dist/stylePostLoader.js!./node_modules/postcss-loader /src??ref--8-oneOf-1-2!./node_modules/sass-loader/dist/cjs.js??ref--8-oneOf-1-3!./node_modules/cache-loader/dist /cjs.js??ref--0-0!./node_modules/vue-loader-v16/dist??ref--0-1!./src/components/SinglePost.vue?vue&type=style&index=0&id=164ef990&lang =scss) 模块构建失败(来自 ./node_modules/sass-loader/dist/cjs.js): 类型错误:this.getoptions 不是函数 在 Object.loader (/usr/src/app/node_modules/sass-loader/dist/index.js:25:24)
我已按照 https://vue-loader.vuejs.org/guide/pre-processors.html 页上的说明进行操作。我正在使用 vue-cli-service serve
启动服务器。
singlepost.vue 中的代码如下,如果使用这个命令来启动服务,我不确定是否需要创建 webpack.config.js 文件。
<style lang="scss">
.btn {
&,&:link,&:visited {
text-transform: uppercase;
text-decoration: none;
padding: 1.5rem 4rem;
display: inline-block;
border-radius: 10rem;
transition: all .3s;
position: relative;
//
}
.....etc etc
</style>
请指导我,我是网络开发新手。
解决方法
或者运行
npm install -D sass-loader@10.1.1 sass
,
这两个包解决了这个问题,
"node-sass": "^4.0.0","sass-loader": "^7.0.0"