使用react-create-app配合customize-cra配置了addLessLoader方法后无法解析less?

image.png
config-overrides.js

const {
    override,
    addLessLoader,
    addWebpackAlias,
} = require('customize-cra')
const path = require("path")
module.exports = override(
    addLessLoader({
        lessOptions: {
            javascriptEnabled: true,
            relativeUrls: false,
            modifyVars: {
                '@primary-color': '#A80000'
            },
            cssModules: {
                localIdentName: "[path][name]__[local]--[hash:base64:5]",
            }
        }
    }),
    addWebpackAlias({
        '@': path.resolve(__dirname, 'src'),
        '@u': path.resolve(__dirname, 'src/utils'),
        '@p': path.resolve(__dirname, 'src/pages'),
    })

)

package.json

{
    "name": "my-app-ts",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
        "@testing-library/jest-dom": "^5.16.4",
        "@testing-library/react": "^13.1.1",
        "@testing-library/user-event": "^13.5.0",
        "@types/jest": "^27.4.1",
        "@types/node": "^16.11.31",
        "@types/react": "^18.0.8",
        "@types/react-dom": "^18.0.0",
        "antd": "^4.20.1",
        "postcss": "^8.1.14",
        "react": "^18.1.0",
        "react-dom": "^18.1.0",
        "react-scripts": "5.0.1",
        "typescript": "^4.6.3",
        "web-vitals": "^2.1.4"
    },
    "scripts": {
        "start": "cross-env REACT_APP_TYPE=0 react-app-rewired  start",
        "build": "react-app-rewired  build",
        "test": "react-app-rewired  test",
        "eject": "react-app-rewired eject"
    },
    "eslintConfig": {
        "extends": [
            "react-app",
            "react-app/jest"
        ]
    },
    "browserslist": {
        "production": [
            ">0.2%",
            "not dead",
            "not op_mini all"
        ],
        "development": [
            "last 1 chrome version",
            "last 1 firefox version",
            "last 1 safari version"
        ]
    },
    "devDependencies": {
        "babel-plugin-import": "^1.13.5",
        "cross-env": "^7.0.3",
        "customize-cra": "^1.0.0",
        "eslint-plugin-prettier": "^4.0.0",
        "http-proxy-middleware": "^2.0.6",
        "less": "4.1.2",
        "less-loader": "5.0.0",
        "postcss-loader": "^4.0.3",
        "postcss-preset-env": "^5.3.0",
        "postcss-pxtorem": "^6.0.0",
        "react-app-rewired": "^2.2.1"
    }
}

阅读 3.1k
1 个回答
新手上路,请多包涵

解决了,不过使用的是其他方案,问题应该是在于create-react-app版本问题,升级版本,使用了ant提供的craco方案支持less

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题