zoukankan      html  css  js  c++  java
  • 39-2 Webpack —Less loader 的 配置

    如果我们希望在项目中使用less、scss、stylus来写样式, 我们这里以less为例,其他也是一样的。  我们还是先创建一个less文件,依然放在css文件夹中:

    这里 创建了 Less 并且 写了 样式。

    老样子 我们在入口写入依赖  让webpack解析并打包:

    然后我们安装 对应的 loader :

    语句安装less 和 lessloader:【记得降低版本 不然报错   】

    npm install less@版本 less-loader@版本 --save-dev

    这里用的是下面这个版本:

    npm install less@3.9.0 less-loader@4.1.0 --save-dev

    然后我们把 module 放到webpack.config.js中:

    module: {
            rules: [
              {
                test: /.less$/i,
                use: [
                  // compiles Less to CSS
                  'style-loader',
                  'css-loader',
                  'less-loader',
                ],
              },
            ],
          },

     TIPS:如果存在一样moudle 和  rules 那么直接吧对象复制即可。。。即存在的就不用复制了(认真看即可 不然打包错误):

    2021年8月5日 09:50:44: 更新错误: 不知道有时候 那个  loader 好像不是 loader  是 use,就是说 module中 rules 中 的 loader  ,css那些都是use ,我现在loaer不行 反正你自己尝试  注意一下这个错误!都试试即可。。。

    然后尝试打包运行。。。。

    这就是 Less 文件 Loader 其实步骤都是一样的 就是 要下载安装loader 和 添加配置和依赖,非常容易啊

    本文来自博客园,作者:咸瑜,转载请注明原文链接:https://www.cnblogs.com/bi-hu/p/15086510.html

  • 相关阅读:
    linux---shell数组
    linux---shell传递参数
    Windows mysql免安装版配置。(版本号-5.6.45);
    contos 6.9 和 centos7 配置docker?
    数据库表的演化过程
    docker简单介绍。
    Linux 配置 mycat 和 分库分表配置。
    Linux 配置mysql 免安装版。
    mycat 简单介绍
    kibana 对es的简单操作。
  • 原文地址:https://www.cnblogs.com/bi-hu/p/15086510.html
Copyright © 2011-2022 走看看