less

vue中使用less

我们需要下载less对应的依赖包

第一步：

安装less依赖，npm install less less-loader --save

第二步：

修改build.js/vue-loader.config.js文件，配置loader加载依赖，让其支持外部的less,在原来的代码上添加

loader:"style-loader!css-loader!less-lader"

第三步：

我们就可以再style中通过 lang="less" 来实现其less的引用

<style scoped lang="less">

 

html 引入less文件

开发工具为vscode

第一步：

在扩展里下载 Easy LESS这个插件

第二步：

在css文件夹中创建一个less后缀名

写入css 如:

    .content{
        a{
            color: red;
        }
    }

保存后css文件夹中会自动生成一个对应的css文件，在html中正常引入，

之后可以在页面刷新看效果了