时间戳

首页 > 解决方案 > npm build 如何通过变量或脚本更改 package.json - 主页值

node.js - npm build 如何通过变量或脚本更改 package.json - 主页值

问题描述

我使用创建了我的应用程序create-react-app，并使用它npm run build来构建生产包。

我需要将应用程序放在不同客户的网站上，每个客户都将应用程序放在不同的子文件夹中。

例如
客户端A：https://clientA.com/myApp
客户端B：https://clientB.com/UAT/myApp
客户端C：https://clientC.com/webApps/myApp

每次构建包时，对于不同的子文件夹，我都需要修改 中的homepage值package.json，构建包并多次重复此步骤。

我的手动步骤如下：

  1. 修改"homepage": "myApp">>npm run build保存构建文件夹进行部署
  2. 修改"homepage": "/UAT/myApp">>npm run build保存构建文件夹进行部署
  3. 修改"homepage": "/webApps/myApp">>npm run build保存构建文件夹进行部署
  4. 不断重复上述操作......

我该如何改善这种情况？我怎样才能构建一次以适应所有不同的路径？
例如，我可以在homepage值中使用变量并将其设置在环境变量中吗？

或者，我可以写一个脚本来做一些事情吗？我希望简化这个编译步骤，最好是执行一次构建或构建脚本。

感谢您的任何帮助或建议。

标签： node.jsreactjsweb-deploymentpackage.jsonnpm-build

解决方案

PUBLIC_URL构建时可以使用环境变量。构建命令如下所示：

PUBLIC_URL=https://clientA.com/myApp npm run build

您可以创建 npm 脚本来简化它，例如：

{
  ...
  "scripts": {
    "build-clientA": "PUBLIC_URL=https://clientA.com/myApp react-scripts build",
    "build-clientB": "PUBLIC_URL=https://clientB.com/UAT/myApp react-scripts build",
  }
  ...
}

如果您想为所有客户端执行一个命令，构建和移动build文件夹的简单 bash 脚本应该可以正常工作，它看起来像：

PUBLIC_URL=https://clientA.com/myApp react-scripts build && mv build clientA
PUBLIC_URL=https://clientB.com/UAT/myApp react-scripts build && mv build clientB

推荐阅读