我目前在一个开源项目上工作，想要添加一个额外的行，有评论，包括项目的链接，所以如果有人去页面源，他会看到链接，但我有一个问题，反应将最小化源在构建和删除所有的评论在公共html，我怎么才能欺骗react构建不删除我的评论，甚至把换行在它之前.
my publicindex.html:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="%PUBLIC_URL%/static/favicon.ico" />
<title>...</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
</body>
</html>
<!-- this project is open source -->
构建版本:
<!doctype html><html lang="en"><head>.....</html>
我想要的:
<!doctype html><html lang="en"><head>.....</html>
<!-- this project is open source -->
我可以想到两种方法:
使用Webpack有一个webpack插件可以做到这一点。然而，它是为webpack 4编写的，所以它可能不适用于webpack 5。它将横幅添加到文件的顶部，而不是末尾。
html-webpack-top-banner-plugin
在build后附加横幅
您也可以在构建完成后将其附加到文件中。(我假设您在这里使用的是Linux，但在其他操作系统中也可以找到类似的方法)
修改package.json中的build脚本如下:
"build": "react-scripts build && echo 'n<!-- This is open source -->' >> build/index.html",
下次运行构建时，注释将被追加到文件中。
我知道这是一个旧的线程。但是如果其他人有这种情况，你可以直接使用gulp。
创建一个名为gulp.js的文件，内容如下:
const gulp = require("gulp");
const gap = require("gulp-append-prepend");
gulp.task("opensource", function (done) {
gulp
.src("build/index.html", { base: "./" })
.pipe(
gap.appendText(`<!-- this project is open source -->`)
)
.pipe(gulp.dest("./", { overwrite: true }));
done();
return;
});
然后你可以用
"build": "react-scripts build && gulp opensource",
package.json中的