执行npm run eject 暴露模块

安装 npm i  less less-loader -D

1.打开 react app 的 webpack.config.js

const sassRegex = /\.(scss|sass)$/;
const sassModuleRegex = /\.module\.(scss|sass)$/;

//添加

const lessRegex = /\.less$/;
const lessModuleRegex = /\.module\.less$/;
 
2. 在 大概467 行 添加 
{
test: lessRegex,
exclude: sassModuleRegex,
use: getStyleLoaders(
{
importLoaders: 2,
sourceMap: isEnvProduction && shouldUseSourceMap,
},
'less-loader'
),
// Don't consider CSS imports dead code even if the
// containing package claims to have no side effects.
// Remove this when webpack adds a warning or an error for this.
// See https://github.com/webpack/webpack/issues/6571
sideEffects: true,
},
// Adds support for CSS Modules, but using SASS
// using the extension .module.scss or .module.sass
{
test: lessModuleRegex,
use: getStyleLoaders(
{
importLoaders: 2,
sourceMap: isEnvProduction && shouldUseSourceMap,
modules: true,
getLocalIdent: getCSSModuleLocalIdent,
},
'less-loader'
),
},
# 必须在 file-loader 上面
 
 
这时 会发现 npm start 会报错 
 
删除 node_modules 
重新安装 npm instal
 
再npm tsatrt 
成功 
 
 
鼓掌

Create React App 安装less 报错的更多相关文章

  1. windows安装anaconda 报错failed to create anacoda menu ?

    windows安装anaconda 报错failed to create anacoda menu ? 装了无数次,每次都是 failed to create anacoda menu然后无选择忽略, ...

  2. Sybase ASE安装过程报错,无法创建数据库设备[AM fork() failed]

    今天同事要搭建一套测试环境,安装开发版的SYBASE ASE 15.03 Windows平台下的,发现安装过程中到了创建数据库设备的环节就开始报错了,报错信息如下: 03/24/14 09:31:44 ...

  3. tap news:week5 0.0 create react app

    参考https://blog.csdn.net/qtfying/article/details/78665664 先创建文件夹 安装create react app 这个脚手架(facebook官方提 ...

  4. Mac安装MAT报错问题

    安装mat报错,提示在/.eclipse/1528649425_macosx_cocoa_x86_64/configuration/1539332382530.log路径下查看错误日志, 原因是/pr ...

  5. Mac安装MySQL-python报错解决

    Mac安装MySQL-pyhton报错 今天在Mac上安装MySQL-python报错,搜遍网络都说什么mysql config路径问题,但是都不行. 解决方案 一开始遇到的问题是: Complete ...

  6. 如何扩展 Create React App 的 Webpack 配置

    如何扩展 Create React App 的 Webpack 配置  原文地址https://zhaozhiming.github.io/blog/2018/01/08/create-react-a ...

  7. 深入 Create React App 核心概念

    本文差点难产而死.因为总结的过程中,多次怀疑本文是对官方文档的直接翻译和简单诺列:同时官方文档很全面,全范围的介绍无疑加深了写作的心智负担.但在最终的梳理中,发现走出了一条与众不同的路,于是坚持分享出 ...

  8. 在 .NET Core 5 中集成 Create React app

    翻译自 Camilo Reyes 2021年2月22日的文章 <Integrate Create React app with .NET Core 5> [1] Camilo Reyes ...

  9. python27(32位)安装模块报错“error: Unable to find vcvarsall.bat”

    1)首先,下载一个Microsoft Visual C++ Compiler for Python 2.7的补丁,下载地址在这里: http://www.microsoft.com/en-us/dow ...

随机推荐

  1. flask的session基础认识

    from flask import Flask,session from datetime import timedelta import os app = Flask(__name__) app.c ...

  2. [转帖]为何 linux 要用 tar.gz,而不用 7z 或 zip?

    为何 linux 要用 tar.gz,而不用 7z 或 zip? http://embeddedlinux.org.cn/emb-linux/entry-level/201908/13-8776.ht ...

  3. 使用Minikube运行一个本地单节点Kubernetes集群(阿里云)

    使用Minikube运行一个本地单节点Kubernetes集群中使用谷歌官方镜像由于某些原因导致镜像拉取失败以及很多人并没有代理无法开展相关实验. 因此本文使用阿里云提供的修改版Minikube创建一 ...

  4. STL stack 常见用法详解

    <算法笔记>学习笔记 stack 常见用法详解 stack翻译为栈,是STL中实现的一个后进先出的容器.' 1.stack的定义 //要使用stack,应先添加头文件#include &l ...

  5. 怎样使用 vue-cli ( Vue 脚手架 )

    vue-cli 是 Vue 官方出品的快速构建单页应用的脚手架, 相当于 React 官方出品的 create-react-app , 下面演示 vue-cli 的 最 基本用法: 1. 全局安装 v ...

  6. JS实现带省略号的长分页显示

    // 刷新|生成分页信息 function refreshPageInfo(data, pageIndex) { var pageSize = data.pageCount pagingInfo.ht ...

  7. 如何使用Navicat 创建一个SqlServer定时任务

    因为网上资料不全,所以自己琢磨了一上午,终于弄出来了,记录一下. step1: 右击[函数]选择[新建函数]添加一个存储过程 step2: 选择[过程],点击下一步直至完成,然后编辑存储过程,保存 s ...

  8. DPI,像素,英寸的关系

    DPI * 英寸 = 像素 eg:在150dpi打印 (2 x 4)英寸的照片 等到多少像素的图像 (150*2)x (150*4) =300 x 600像素 同理可得  已知像素.英寸大小 求DPI ...

  9. Java 串口通信 Ubuntu

    说一下我的操作过程吧 在Windows上先用阿猫串口网络调试助手,进行调试: 在网上找Java代码,我选择的是RXTXcomm,网上代码很多,基本都一样. 在Windows电脑上把rxtx压缩包中的r ...

  10. JavaScript函数式编程——柯里化

    柯里化原理 如何实现柯里化 柯里化的应用 一.柯里化原理 柯里化:在数学和计算机科学中,柯里化是一种使用多个参数的一个函数转换成一系列使用一个参数的函数的技术. 前端使用柯里化的用途主要就应该是简化代 ...