【vue】less 全局变量的配置

最新推荐文章于 2024-05-23 19:57:47 发布

芳月存心

最新推荐文章于 2024-05-23 19:57:47 发布

阅读量952

点赞数 1

分类专栏： vue 文章标签： vue.js

本文链接：https://blog.csdn.net/z767327552/article/details/105953576

版权

本文介绍了在Vue项目中如何配置和使用less全局变量，包括安装style-resources-loader，配置vue.config.js以引入全局变量文件，解决可能出现的路径识别问题，确保CSS构建成功。在遇到此类问题时，path函数的正确使用是关键。

摘要由CSDN通过智能技术生成

安装style-resources-loader；
在vue.config.js中的pluginOptions添加第三方插件：

a.引入路径：const path = require(‘path’)；
b.配置：

pluginOptions: {

        'style-resources-loader': {

            preProcessor: 'less',

            patterns: [

              path.resolve(__dirname, './src/assets/custom.less') //使用path.resolve

            ]

          }

    },

在定义的less文件上部声明文件采用 UTF-8 编码：

@charset “UTF-8”;

原文：https://www.cnblogs.com/wxx-17-5-13/p/11712548.html

在使用nuxt+vue的时候，对less全局变量进行配置。

 styleResources: {
        less: './src/xxx.less' //某些情况会配置失败。
    }

出现的报错信息

 error  in ./src/views/project/partyBuild/partyBuildInform.vue?vue&type=style&index=0&id=addaa0d0&scoped

最低0.47元/天解锁文章