Solution: The problem of unsuccessful introduction of external files such as base.scss/ base.less in single-project components

1. Problem display:

First, the description of the problem: the use of styles
encapsulated in base.scssor has been unsuccessful;base.less

Second, the code:
//Although it has been marked that the syntax of is used scss.scss,style the style in the page call is still unsuccessful ;

<style rel="stylesheet/scss" lang="scss" scoped>
</style>

Third, page display:

// The page has no style effects ;

2. Problem analysis:

First .scss, the file written in the style is not referenced in main.jsthe ;

Second, or did main.jsnot .scsswrite the relevant style in the referenced file (that is, it is actually the same thing );

3. The solution process:

First, (taking sass(scss)as an example ) first check whether sassandsass-loader in the project . If not, then .scssthe file not take effect;

Second, if there 其一is write related styles in the file imported main.jsin ;.scss

Third, if it does not 其一exist , or import the style .scssfile into it;main.js

Fourth, the page is displayed as:
// Indicates that the written style has taken effect (note: scss/lessall languages ​​are operated in this way);

4. Summary:

First, where there is something wrong or inappropriate, please give me some pointers and exchanges!
Second, if you are interested, you can pay more attention to this column (Vue (Vue2+Vue3) interview must-have column):https://blog.csdn.net/weixin_43405300/category_11525646.html?spm=1001.2014.3001.5482