提问人：n79qk272x57w46w9 提问时间：6/2/2023 最后编辑：n79qk272x57w46w9 更新时间：6/2/2023 访问量：31
Webpack 如何对静态 HTML 站点中的现有类进行哈希处理？
how can webpack hash existing classes in a static html site?
问：
我正在尝试更新我多年前制作的一些非常旧的网站，以便在 webpack 上运行。我还发现了一个可以使用 css-loader 对类名进行哈希处理的功能，但它似乎不适用于我的项目。也许它仅适用于链接样式。
索引.html
<html><div class="hashThis"></div></html>
索引.js
require("../static/css/index.css")
require("../static/css/unsemantic-grid-responsive.css")
$(async () => {
...
webpack.config.js
process.env.mode || require('dotenv').config()
const HtmlWebpackPlugin = require('html-webpack-plugin')
const WebpackObfuscator = require('webpack-obfuscator')
const { EnvironmentPlugin } = require('webpack')
console.log('[-] webpack - webpack.config.js -', process.env.mode, process.env.srv_host, process.env.srv_port)
module.exports = {
mode: process.env.mode,
devServer: {
client: { overlay: false },
hot: process.env.mode === 'development',
liveReload: process.env.mode === 'development',
static: {
directory: './static', publicPath: '/',
serveIndex: process.env.mode === 'development',
},
proxy: {},
port: process.env.srv_port,
host: process.env.srv_host,
// proxy: { '/api': { target: process.env.api_host, pathRewrite: { '^/api': '' } } },
},
entry: './src/index.js',
plugins: [
new HtmlWebpackPlugin({ template: './static/index.html' }),
new EnvironmentPlugin(['api_host']),
new WebpackObfuscator ({ rotateStringArray: true })
],
output: {},
module: {
rules: [ {
test: /\.css$/i,
use: [
{ loader: 'style-loader' },
{ loader: 'css-loader', options: { modules: { localIdentName: '[sha1:hash:hex:4]' } }}, // importLoaders: 1,
]
}],
}
}```
答： 暂无答案
评论