第一种配置方式(推荐)

npm install style-resources-loader vue-cli-plugin-style-resources-loader less-loader less -S
// vue.config.js文件中的配置
const path = require('path');
module.exports = {
pluginOptions: {
'style-resources-loader': {
preProcessor: 'less',
patterns: [
path.resolve(__dirname, './src/assets/common/global.less')
]
}
}
}

第二种配置方式

npm i style-resources-loader -D
// vue.config.js文件中的配置
const path = require('path')
module.exports = {
chainWebpack: config => {
const types = ['vue-modules', 'vue', 'normal-modules', 'normal']
types.forEach(type =>
addStyleResource(config.module.rule('less').oneOf(type)))
}
} // add style resource
function addStyleResource(rule) {
rule.use('style-resource')
.loader('style-resources-loader')
.options({
patterns: [path.resolve(__dirname, "./src/assets/common/global.less")]
})
}

Vue-cli3.0配置全局less的更多相关文章

  1. vue cli3.0 结合echarts3.0和地图的使用方法

    echarts 提供了直观,交互丰富,可高度个性化定制的数据可视化图表.而vue更合适操纵数据. 最近一直忙着搬家,就没有更新博客,今天抽出空来写一篇关于vue和echarts的博客.下面是结合地图的 ...

  2. vue cli3.0打包

    1.vue cli3.0需要在项目根目录下配置webpack  包括反向代理以及打包文件路径 const webpack = require("webpack"); module. ...

  3. 01-路由跳转 安装less this.$router.replace(path) 解决vue/cli3.0语法报错问题

    2==解决vue2.0里面控制台包的一些语法错误. https://www.jianshu.com/p/5e0a1541418b 在build==>webpack.base.conf.j下注释掉 ...

  4. 解决vue/cli3.0 语法验证规则 ESLint: Expected indentation of 2 spaces but found 4. (indent)

    当你使用vue/cli3.0的时,有可能出现雁阵规则 ESLint: Expected indentation of 2 spaces but found 4. (indent) 解决方法 1.在vu ...

  5. vue cli4.0 配置环境变量

    温馨提示:本文只适用于vue-cli 3.0 及以上的版本哦~ ------------------正文开始------------------ 开发项目时,经常会需要在不同环境中切换.那么我们如何配 ...

  6. vue cli3 项目配置

    [转]https://juejin.im/post/5c63afd56fb9a049b41cf5f4 基于vue-cli3.0快速构建vue项目 本章详细介绍使用vue-cli3.0来搭建项目. 本章 ...

  7. 使用VUE CLI3.0搭建项目vue2+scss+element简易版

    1.安装Vue CLI 3 //三选一即可cnpm install -g @vue/cli npm install -g @vue/cli yarn global add @vue/cli 注意: 1 ...

  8. vue cli3.0 封装组件全局引入js文件并发布到npm

    首先用 vue create创建一个项目 当前的项目目录是这样的: 首先需要创建一个 packages 目录,用来存放组件 然后将 src 目录改为 examples 用作示例 二.修改配置 启动项目 ...

  9. VUE CLI3.0安装及配置

    # 安装 npm install -g @vue/cli # 查看已安装版本vue --version 或者 vue -V # 卸载 npm uninstall @vue/cli -g # 新建项目 ...

  10. vue cli3.0快速搭建项目详解(强烈推荐)

    这篇文章主要介绍下vue-cli3.0项目搭建,项目结构和配置等整理一下,分享给大家. 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cl ...

随机推荐

  1. deque、queue和stack深度探索(下)

    deque如何模拟连续空间?通过源码可以看到这个模型就是通过迭代器来完成. 迭代器通过重载操作符+,-,++,--,*和->来实现deque连续的假象,如上图中的 finish-start ,它 ...

  2. mysql_取分组后的前几行值

    --方法一: select a.id,a.SName,a.ClsNo,a.Score from Table1 a left join Table1 b on a.ClsNo=b.ClsNo and a ...

  3. ehcache详解

    Ehcache是现在最流行的纯Java开 源缓存框架,配置简单.结构清晰.功能强大,最初知道它,是从Hibernate的缓存开始的.网上中文的EhCache材料以简单介绍和配置方法居多, 如果你有这方 ...

  4. vue SCSS

        C:\eclipse\wks\vue\esql-ui>node -v v12.18.1 C:\eclipse\wks\vue\esql-ui>npm -v 6.14.5 直接修改p ...

  5. iOS调用系统电话、浏览器、地图、邮件等

    - (IBAction)openMaps { //打开地图 NSString*addressText = @"beijing"; //@"1Infinite Loop, ...

  6. oracle体系结构(图)

  7. de1ctf_2019_weapon(爆破_IO_2_1_stdout)

    (这是我真正意义上的完完全全自己做的第一道堆题目,虽然花了快三个小时,谨以此篇纪念一下) 题目的例行检查我就不放了,将程序放入ida中 程序的逻辑十分简单,漏洞也非常明显 重点是这个程序没有给我们sh ...

  8. Redis篇:持久化、淘汰策略,缓存失效策略

    关注公众号,一起交流,微信搜一搜: 潜行前行 redis 持久化 redis 的数据是保存再系统内存里面的.持久化就是把内存的数据转移到磁盘中,redis 的持久化策略有两种:RDB.AOF RDB ...

  9. CF981B Businessmen Problems 题解

    Content 有一个长度为 \(n\) 的序列和长度为 \(m\) 的序列,两个序列中的元素都有一个编号 \(num\) 和一个值 \(val\),且同一个序列的元素之间的编号互不相同.现在从这两个 ...

  10. 洛谷八月月赛 II T2 题解

    Content 现有 \(T\) 次询问. 每次询问给定一个长度为 \(n\) 的 01 串,记为 \(A\).回答应是一个字符串 \(B\),满足: \(B\) 是长度为 \(m\) 的 01 串. ...