vue-cli配置less

    科技2024-01-28  107

    安装vue—cli指令 和 less配置

    npm i vue-cli-g //全局安装 通过脚手架的方式创建项目:vue init webpack 项目名(不能大写) 进入文件夹:cd 项目名 运行项目:npm run dev/npm start 当项目写完了打包:npm run bulid index.html文件:是一个让我们插件进行复制的一个文件 引进css: import from 'xx.css' 引进js: import 变量名 from "路径" 配置less和less-loader: 首先下载:npm i less less-loader -D 进入app下的build文件下找到webpack.base.config.js 在rules数组下面写入一个对象进行配置: { test:/\.less$/, loader:"style-loader!css-loader!less-loader" } 然后在重启服务器 在需要使用less的时候只需要在style里面添加一个属性lang="less", 注意(因为less-loader最新的版本会造成运行出错,下载less-loader的时候需要加上版本号) 如果是因为less-loader版本过高,卸载npm uninstall less-loader,重新安装npm less-loader 安装指定版本npm install less-loader@4.1.0 --save 重新运行
    Processed: 0.011, SQL: 8