How to install stylus for the first time in vue (detailed tutorial)

Below I will share with you an article about the first use of stylus installation method after initialization after creating a vue project. It has a good reference value and I hope it will be helpful to everyone.

Project creation error:

This dependency was not found:
* !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-1d57e5ea","scoped":false,"hasInlineConfig":false}!stylus-loader?{"sourceMap":false}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./a.vue in ./src/components/a.vue
To install it, you can run: npm install --save !!vue-style-loader!css-loader?{"minimize":false,"sourceMap":false}!../../node_modules/vue-loader/lib/style-compiler/index?{"vue":true,"id":"data-v-1d57e5ea","scoped":false,"hasInlineConfig":false}!stylus-loader?{"sourceMap":false}!../../node_modules/vue-loader/lib/selector?type=styles&index=0!./a.vue

Solution:

npm install stylus-loader css-loader style-loader --save-dev

After installation An error will also be reported:

Module build failed: Error: Cannot find module 'stylus'
 at Function.Module._resolveFilename (module.js:485:15)
 at Function.Module._load (module.js:437:25)
 at Module.require (module.js:513:17)
 at require (internal/module.js:11:18)
 at Object.<anonymous> (E:\project\selling\node_modules\stylus-loader\index.js:2:14)
 at Module._compile (module.js:569:30)
 at Object.Module._extensions..js (module.js:580:10)
 at Module.load (module.js:503:32)

Continue execution:

npm install stylus

Then execute npm run dev

Solution

Therefore, during the first initialization, you need to perform the following installation steps

1.npm install stylus --save-dev

2.npm install stylus- loader --save-dev

3.npm run dev (you need to restart the project every time you change the configuration file)

The above is what I compiled for everyone. I hope it will be useful to everyone in the future. help.

Related articles:

How to use ztree in vue (detailed tutorial)

How to encapsulate Swiper in Vue to implement image carousel

What are the differences between export and export default in es6?

How jQuery implements image carousel

jQuery How to prevent the same event from being triggered quickly and repeatedly

Use AnglarJs to implement pull-up loading

The above is the detailed content of How to install stylus for the first time in vue (detailed tutorial). For more information, please follow other related articles on the PHP Chinese website!