zoukankan      html  css  js  c++  java
  • 如何在Vuespa中使用less

    1.首先在node中安装less的库和依赖:

    npm install less less-loader --save //将less和less-loader安装到开发依赖
    

    2.在vue文件中的webpack.conf.js(有的是webpack.base.conf.js)中添加对less的引用:

    module: {
        rules: [
        //以上省略其他的加载引用
          {
            test: /.less$/,
            loader: 'less-loader',
            loader: "style-loader!css-loader!less-loader",
          },
        ]
      },
    

    3.新建less文件,在.vue中引用就可以了:

    <style type="text/less" lang="less" scoped>
    @import '../utils/less/index.less'; //自己less文件的路径
    </style>
    

    4.如果想要使用内嵌式的样式的话在style中修改一下就行了,如下:

    <style lang="less" scoped>
    </style>
    

    5.有些人在使用4的时候可能会出现less的定义未被识别的问题可以试试修改成一下的样式:

    <style type="text/less" lang="less" scoped>
    </style>
    
  • 相关阅读:
    锚点
    autoLayout
    基础动画
    核心动画
    get和post的区别
    block的定义及使用
    传值-自定义构造函数传值
    字符串
    字典与可变字典
    RabbitMQ的可视化界面进行操作
  • 原文地址:https://www.cnblogs.com/play1997/p/13609100.html
Copyright © 2011-2022 走看看