search

bencodezen / vue-enterprise-boilerplate

An ever-evolving, very opinionated architecture and dev environment for new Vue SPA projects using Vue CLI.
7.78k stars 1.32k forks source link

sass-loader unable to load from updated .scss files #222

Closed dwschulze closed 4 months ago

dwschulze commented 3 years ago

I'm rewriting an existing project using the latest vue enterprise boilerplate. Starting with some of the previous code I'm running into compile problems importing from .scss files which are all in the directory src/design/. This code:

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

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

throws this error:

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

The relative-block exists in the design/_positioning.scss file and Intellij finds it

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

There are other errors like this for new code in .scss files or new .scss files. When I update a .scss file of add a new .scss file into the design/ folder do I have to tell the sass-loader to look for updated .scss files?

bencodezen commented 4 months ago

Sorry for the delay in responding to this @dwschulze. I let the project lapse and am in the process of currently updating it to Vue 3 standards.

In order to clean up issues, I'll be closing this issue at this time, but if you still have issues with the new boilerplate or have questions, please don't hesitate to open another issue.