vue+scss全局使用mixin方法

最新推荐文章于 2025-06-15 18:27:52 发布

周家大小姐.

最新推荐文章于 2025-06-15 18:27:52 发布

阅读量2.2k

点赞数

CC 4.0 BY-SA版权

分类专栏： element vue2.0 SCSS 文章标签： vue.js scss javascript

本文链接：https://blog.csdn.net/qq_40190624/article/details/121121698

先自行安装scss
或者安装如下1.0版也可

npm  install sass-loader@10.1.1 --save-dev
npm install node-sass --sava-dev

想要在vue-cli中全局使用 scss的全局变量和 @mixin样式混入，需要安装插件，然后在 vue.conf.js 中配置

npm install style-resources-loader vue-cli-plugin-style-resources-loader --save-dev

vue.config.js 中配置

module.exports = {
   
   
  pluginOptions: {
   
   
    'style-resources-loader': {
   
   
      preProcessor: 'scss',
      patterns: [
        // 路径根据具体需求更改
        path.resolve(__dirname, 'src/style/_handle.scss')
      ]
    }
  <