Problem Description:
In the style introduced for the introduction of variables need to be introduced again in each file, in order to avoid problems need to be introduced individually over again each use, using a style-resources-loader
solution:
Step 1: installing the plug npm install stylus-resources-loader --save-dev or vue add style-resources-loader under the project directory
Step 2: Then there will be a choice of language options allow CSS Pre-processor ?, select syntax, scss, sass, stylus and less current application, I currently chose stylus
Step 3: vue.config.js under the project root directory (not require new) modified with the following theme:
Then restart the project, run npm run serve on it
As for why the introduction of a index.styl files directly main.js in not in effect I have confused
Q: About the introduction of this variable template, not been introduced yet in index.styl, and icon.styl and reset.styl, I was confused since the introduction of, why do you need to introduce variable template in a single file, but not need to repeat the introduction of other such icon.styl
A: From the stylus compiled angle to think about this problem when you compile the stylus to file a component that uses a variable, if not to import variable, how it knows what the variable is yes. Your so-called index, but you think it is home, but stylus compiler, it does nothing. The style-resource-loader to do, is to tell the compiler stylus, I quoted some global variables, if you can not find the time to come and collect from me.