整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
、安装node.js:
下载地址（node.js中文网）：http://nodejs.cn/download/
安装方式使用默认安装即可。在cmd中输入node -v 和 npm -v如果成功显示了版本号，node.js安装成功。如图：
2、使用node.js 安装
在命令窗口中输入： npm install -g less 进行less的安装。
3、配置webstorm
打开webstorm, File——Settings——Tools——File Watchers——点击 加号——选择less
默认设置即可，点击ok ,就可以了
4、创建less文件，直接创建文件添加后缀名为.less的文件即可。
或者创建css文件，选择less也就可以了。
创建成功后，同时在less中生成css同名文件。配置及完成。
ess（Leaner Style Sheets 的缩写）是一种向后兼容的 CSS 语言扩展。Less.js 是将 Less 样式转换为 CSS 样式的 JavaScript 工具。
npm i less less-loader -D
安装 less less-loader
/src/assets/styles/base.less
@bg: #f7f7f7;
.p {
color: red;
}// ...
export default defineConfig({
// ...
css: {
preprocessorOptions: {
less: {
modifyVars: {
hack: `true; @import (reference) "${resolve('src/assets/styles/base.less')}";`,
},
javascriptEnabled: true,
},
},
},
})<template>
<h3>Less样式</h3>
<p>这使用了base.less的样式</p>
</template>
<style lang="less" scoped>
h3 {
background-color: @bg;
}
p {
.p()
}
</style>// ...
const pLess = () => import('@v/test/less.vue')
const testRoutes = [
{
path: '/less',
name: 'less',
meta: {
title: 'less',
},
component: pLess,
},
// ...
]<template>
<main>
<nav class="nav">
<router-link to="/less" active-class="on">less全局引入</router-link>
// ...启动项目查看 npm run dev
效果
----- End -----
*请认真填写需求信息，我们会在24小时内与您取得联系。
