创建React / Craco :如何实现更改类名的"localIdentName“选项？

Question

如何在create/ @craco中使用"localidentname“更改类名模式，如下面所述：https://webpack.js.org/loaders/css-loader/#localidentname我使用dart-sass作为样式。

package.json

{
    "name": "client",
    "version": "0.1.0",
    "private": true,
    "dependencies": {
        "@craco/craco": "^6.4.3",
       ...
        "react": "^18.1.0",
       ...
        "react-scripts": "5.0.1",
     
    },
    "scripts": {
        "start": "craco start",
        "dev": "export HTTPS=true&&SSL_CRT_FILE=cert.pem&&SSL_KEY_FILE=key.pem craco start",
        "build": "craco build",
        "test": "craco test",
        "eject": "craco eject",
        "lint": "eslint ./",
        "lint-fix": "eslint ./",
        "stylelint": "stylelint \"**/*.scss\""
    },
  ....
    "devDependencies": {
        "@babel/plugin-proposal-optional-chaining": "^7.18.9",
        ...
        "sass": "^1.54.2",
      ...
    }
}

craco.config.js

module.exports = {
   'style': {
        'sass': {
            'loaderOptions': {
                'implementation': require('sass'),
                'sassOptions': {
                    'localIdentName': '[path][name]__[local]-test-[hash:base64:5]',
                }
            }
        },
    },
}

Answer 1

在调试craco /features/webpack/style/css.js之后，我找到了解决方案：

module.exports = {
    'style': {
        'modules': {
            'localIdentName': '[path][name]__[local]-testtest-[hash:base64:5]'
        },
        'css': {
            'modules': {}
        },
    }
}