DEV Community


Discussion on: My SCSS setup within a Vue CLI 3 project

hjelperne profile image
hjelperne • Edited

Hi - a newbie question here - if anyone can please fill me in:

Following your guide I have successfully added vue-cli-plugin-scss-base (0.1.10) to my vue project.
And when using the "vue ui" (Vue Project Manager in your browser) approach - the scss folder with all the scss files get generated (as well as changes to vue.config.js and App.vue).

I suppose this happens just about the time the terminal which I engage "vue ui" from reports:
"🚀 Invoking generator for vue-cli-plugin-scss-base...
✔ Successfully invoked generator for plugin: vue-cli-plugin-scss-base
The following files have been updated / added:" (and the list of files: src/scss/animations/_animations.scss etc.......)

Now the question is: How would I go about doing this from the terminal??

I mean: "npm i vue-cli-plugin-scss-base" adds the statements to package.json and package.lock.json (in dependencies)

And "npm i vue-cli-plugin-scss-base --save-dev" adds to devDependencies (same as vue ui - from browser) when I add the plugin there..

but after that npm install / npm build / (rebuilding entire project in IntelliJ) or whatever I tried - it doesn't seem to have any effect. The scss file creation and file changes (mentioned above) never appear/happens.

Surely there is some essential command (knowledge) I am completely missing.

NEVER mind - the solution was as simple as: "vue add vue-cli-plugin-scss-base"

best regards,

lynnewritescode profile image
Lynne Finnigan Author

Hi, I was just about to look into this, did you get it all sorted then?