【问题标题】：Using command line arguments with ReactJS在 ReactJS 中使用命令行参数
【发布时间】：2018-01-10 01:50:30
【问题描述】：

我想知道是否可以在 ReactJS（不是 react-native）中使用命令行参数。例如，是否可以输入一个简单的字符串并将其保存为变量以便显示？ npm yargs 模块是我正在寻找的那种东西，但我无法让它工作，因为它产生的子进程显然不能在浏览器中工作。

编辑：我也尝试过在 h1 标签中包含 {process.argv[0]} 之类的东西，但没有任何显示。

【问题讨论】：

标签： node.js reactjs command-line-arguments yargs

【解决方案1】：

React 对命令行参数没有任何特别之处。事实上，它主要被设计为一个 DOM 库。您可以使用 yargs，然后将值传递给 React 组件。

【讨论】：

在这种情况下，我没有正确包含 yargs。现在我在 App.js 中有 const argv = require('yargs').argv; ，它正在被导入 index.js。 App.js 包含我想使用 yargs 的地方。我应该在哪里包含该模块？
我在命令行中运行它（npm start --blah blah）并在浏览器中查看它。
那么你是在使用服务器端渲染和 react 吗？此外，按照您构建命令的方式，npm 正在吞噬命令行参数。你需要npm start -- --blah blah
然后我仍然收到相同的错误反应：./~/execa/index.js 未找到模块：无法解析 'C:...\react- 中的 'child_process'测试\node_modules\execa'

【解决方案2】：

例如你在终端或cmd中运行这个命令

npm start -- foo

foo 是你的论点。你可以像这样打印你的

// print process.argv
process.argv.forEach(function (val, index, array) {
  console.log(index + ': ' + val);
});

在你的脚本中。

【讨论】：

【解决方案3】：

React 运行在客户端

React 是一个客户端库。它在浏览器上的网页中运行。最终用户不使用命令行来“运行”React，因此最终用户无法使用命令行参数。

对于开发者

作为开发人员，您确实使用工具来启动开发服务器并启动运行 React 的浏览器。最有可能的是，您正在使用 Create React App。您可以使用 environment variables 将变量/参数传递给 React。具体来说，文档提供these examples：

# on Linux and macOS
REACT_APP_NOT_SECRET_CODE=abcdef npm start

# on Windows (cmd.exe)
set "REACT_APP_NOT_SECRET_CODE=abcdef" && npm start

请注意，这些变量在构建时嵌入到 React 中，此时 Create React App 捆绑并构建您的应用程序（有点像编译）。这意味着，如果您构建您的 React 项目，然后将输出文件传输到另一台服务器并尝试传递新变量，则一切都不会改变。

对于服务器

如果您的 React 构建文件位于服务器上，并且您希望能够将命令行参数传递给 服务器 并更改 React，这也是可能的，但很大程度上取决于什么软件你用来服务。从广义上讲，服务器将获取运行时参数并将其传递到呈现您的 React 应用程序的模板中。然后在该页面上运行的任何 Javascript 都可以访问参数。

【讨论】：