Vue3 + Vite 使用 Less 配置

安装 less
npm install less -D
（Vite 和 Webpack 不同，不需要 less-loader 等，只需安装 less）
在 vite.config.js 中加入：

    css: {preprocessorOptions: {less: {modifyVars: {hack: `true; @import (reference) "${resolve("src/assets/less/index.less")}";`,},javascriptEnabled: true,},},},

即可在组件中使用 less

<style lang="less" scoped>
.logo {h1 {color: @mainColor;}
}
</style>

Vue3 + Vite 使用 Less 配置相关推荐

【记录】VUE3 + VITE + TS 配置跨域
[记录]VUE3 + VITE + TS 配置跨域在vite.config.ts进行如下设置在vite.config.ts进行如下设置 server: {host: true,// 设置端口号po ...
Vue3系列(一)之初始化项目及Vite 2.0配置
Vite 2.0配置一.vite介绍二.项目搭建- vue3.0 + vite2 三.配置留存 vite.config.js 一.vite介绍 vite官网:https://cn.vitejs.d ...
vue3+vite中使用环境变量 .env 的一些配置情况说明
在项目文件中新建文件.env .env.pro 两个文件其中.env 是默认设置 .env.pro 为正式环境设置 1.设置.env中的内容信息注意vue3+vite 必须使用VITE开头的配置信息 ...
nginx vue2+webpack 和 vue3+vite 配置二级目录访问
首先我们要配置一个106.13.0.11:8083/qfqzApp的二级路由,针对于vue2项目,我们需要进行一下操作. 1.nginx配置(vue2 和 vue3配置的nginx相同) server ...
vue3+vite配置项目运行前eslint检查以及git提交前eslint检查的方案总结
vue3+vite配置项目运行前eslint检查以及git提交前eslint检查的方案总结 1.需求背景最近在新项目搭建过程中有这样一个需求:由于是团队协同开发,所以在开发是代码规范是一个很重要的环 ...
vue3+vite项目跨域配置（踩坑无数篇）
写这篇多少有点心情复杂,毕竟因为一个巨巨巨巨没意思的bug卡了两整天- 废话不多说啦,开篇入题叭,希望大家都能改好自己的bugggggg!!! 1.vite.config.js配置注意:因为我是用v ...
【Vue3+Vite+TS项目集成ESlint +Prettier实现代码规范检查和代码格式化】
目录前言创建项目安装初始化ESlint 安装ESlint: 初始化ESlint: 安装配置Prettier 安装prettier: 配置prettier: 配置VScode保存时自动格式化代码 ...
vue3 + vite + ts + setup , 第七练 TSX的使用
在Vue2 中我们可以使用jsx 但是好像不是很友好,也很少用,vue3对typescript的支持度,tsx写法越来越被接受,那么我们也了解一下TSX如何使用,学习学习一.安装配置 1.安装插件p ...
SSM 尚筹网 Vue3 + Vite + Java
SSM 尚筹网 2022年3月27日15:07:51 文章目录 SSM 尚筹网 1.Maven结构: 1.基于Maven的MyBatis逆向工程 2.资源归为 3. 父工程管理 4.SSM整合步骤 4 ...
【Vue3+vite+Element-UI Plus 】
1 Vue3 + vite + Element-UI Plus 全局配置在终端中利用命令 npm init vite-app 项目名称 ,创建基于 vite 的 vue3 项目利用命令 npm i ...

Vue3 + Vite 使用 Less 配置

Vue3 + Vite 使用 Less 配置相关推荐

最新文章

热门文章