如何在应用程序React.js中搜索所有硬编码文本？

Question

我需要使用react i18n搜索并移动文件.json以进行国际化。硬编码文本和手动制作的内容太长且不确定。我想使用自动解决方案。

例如： 在我检查之前

function NotFoundPage(props) {
    const { t } = useTranslation("notFoundPage");
return (
    <Result
        status="404"
        title="404"
        subTitle="Sorry, the page you visited does not exist."
        extra={
            <Button
                type="primary"
                style={{ margin: "auto" }}
                onClick={() => props.history.push("/")}
            >
                Back to Projects
            </Button>
        }
    />
);

}

我检查后

function NotFoundPage(props) {
    const { t } = useTranslation("notFoundPage");
    return (
        <Result
            status="404"
            title="404"
            subTitle={t("Sorry, the page you visited does not exist.")}
            extra={
                <Button
                    type="primary"
                    style={{ margin: "auto" }}
                    onClick={() => props.history.push("/")}
                >
                    {t("Back to Projects")}
                </Button>
            }
        />
    );
}

带有“对不起，...”和“返回...”的行，我将其更改为将其放入.json文件中，但有时在长文件中有时很难找到硬编码的文本。 / p>

Answer 1

您可以使用正则表达式查找所有以字母字符开头的html标签。那些未经硬编码的人通常以“ {”（JSX表达式）

开头

下面是Visual Studio Code中的示例。 Crtl + SHIFT + F可以搜索所有项目。 不要忘记在搜索栏中选择RegExp选项。