Question

我正在使用最新的vue企业样板重写现有项目。我还没有找到使用vue企业样板的任何示例，所以我在做反复试验。当使用一些现有的带有大<style>块的代码时，我遇到了从.scss目录中的src/design/文件导入时出现的编译问题。这段代码

<style lang="scss" module>
@import '@design';

.container {
  @extend %relative-block;
...

引发此错误

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: The target selector was not found.
Use "@extend %relative-block !optional" to avoid this error.
   ╷
86 │   @extend %relative-block;
   │   ^^^^^^^^^^^^^^^^^^^^^^^
   ╵
  /home/dean/src/vue/examples/rewrite.0/src/components/nav-bar.vue 86:3  root stylesheet

相对块存在于design/_positioning.scss文件中，Intellij能够找到它

%relative-block {
  position: relative;
  display: block;
}

使用sass @mixins时也会出错：

@include lq-size(100%, 100%);

给予

Module build failed (from ./node_modules/sass-loader/dist/cjs.js):
SassError: Undefined mixin.
   ╷
50 │   @include lq-size(100%, 100%);
   │   ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
   ╵
  /home/dean/src/vue/examples/rewrite.0/src/app.vue 50:3  root stylesheet

@mixin lq-size存在，并且Intellij在design/_mixins.css中找到它：

@mixin lq-size($width, $height) {
  width: $width;
  height: $height;
}

对于我已添加到.scss目录的新src/design/文件中的代码，以及对于现有.scss文件中的新代码，都会发生这些错误。

我是sass和scss的新手。当我更新.scss文件并将新的.scss文件添加到src/design/文件夹时，我是否必须告诉sass-loader寻找更新的.scss文件？

Vue企业样板：sass-loader无法从更新的.scss文件加载

0 个答案: