如何在react应用程序中哈希较少的类名？

问题描述

因此，我相信它被称为“ css模块”，其中，css类名被散列了。我在webpack.config中尝试了以下代码，但此代码产生了相反的效果。它没有散列类，也没有应用“ less”，而是显示了没有任何CSS定制的普通应用程序。

加载器版本为：

"less": "^3.12.2","css-loader": "^4.3.0","less-loader": "^7.0.1","style-loader": "^1.2.1","webpack": "^4.44.2","webpack-cli": "^3.3.12","webpack-dev-server": "^3.11.0"

const HtmlWebPackPlugin = require("html-webpack-plugin");
const CleanCssplugin = require('less-plugin-clean-css');

module.exports = {
  module: {
    rules: [
      {
        test: /\.(js|jsx)$/,exclude: /node_modules/,use: {
          loader: "babel-loader"
        }
      },{
        test: /\.html$/,use: [
          {
            loader: "html-loader"
          }
        ]
      },{
        test: /\.less$/,exclude: /\.module\.less$/,use: [
                {loader:'style-loader'},{loader:'css-loader',modules:{localIdentName: '[path][name]__[local]--[hash:base64:5]'}
                },{ loader:'less-loader',options: {lessOptions: {javascriptEnabled: true}}
                }
            ]
    },{
      test: /\.svg$/,use: ['@svgr/webpack'],},{
      test: /\.(jpe?g|png|gif)$/i,use: [
        {
          loader: 'file-loader',options: {
            query: {
              name:'assets/[name].[ext]'
            }
          }
        },]
    }
    ]
  },devServer: {
    historyApiFallback: true
  },resolve: {
    extensions: ['*','.js','.jsx','.less']
  },plugins: [
    new HtmlWebPackPlugin({
      template: "./src/index.html",filename: "./index.html"
    })
  ]
};

我们非常感谢您的帮助。预先感谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）