在 windows 上配置 package.json [英] configuring package.json on windows

问题描述

我正在尝试在 windows 上管理 react 项目的配置，它以前在 mac 上运行.我正在使用 yarn build.package.json scripts>build 被配置为 "rm-rf deployment/static;react-scripts build && mv build deployment/static".由于 rm-rf 和 mv 命令适用于 Linux，我尝试使用 rmdir/del 和 move 代替.. 但它似乎不起作用.我收到错误:参数格式不正确 - 静态".

I'm trying to manage the configuration of a react project on windows, it was previously running on mac. I'm using yarn build. inside the package.json scripts>build was configured as "rm-rf deployment/static;react-scripts build && mv build deployment/static". since the rm-rf and mv commands are for Linux, I tried using rmdir/del and move instead.. but it doesn't seem to work. I'm getting the error: Parameter format not correct - "static".

推荐答案

Windows 解决方案 (cmd.exe)

在 Windows 上通过 命令提示符 或 PowerShell 运行的 build 脚本的等价物是:

Windows Solution (cmd.exe)

The equivalent of that build script running via Command Prompt or PowerShell on Windows is:

"scripts": {
  "build": "rd /s/q \"deployment/static\" 2> nul & react-scripts build && md \"deployment/static\" && move \"build\" \"deployment/static\""
}

说明:

1. Windows (cmd.exe) 的 rm-rf 等效项是 <代码>rd/s/q
2. 与 Windows (cmd.exe) 等效的 mv 是 移动

3. 所有目录路径都用转义双引号包裹起来\"...\".例如;

1. The rm-rf equivalent for Windows (cmd.exe) is rd /s/q
2. The mv equivalent for Windows (cmd.exe) is move

3. All directory paths have been wrapped in escaped double quotes \"...\". For example;

deployment/static 已改写为 \"deployment/static\".

虽然在这种情况下转义双引号不是完全必要的，但当路径可能包含空格或标点符号时，这是一种很好的做法并且有必要这样做.

Although escaped double quotes are not entirely necessary in this scenario, it's good practice and necessary to do this when paths may include spaces or punctuation characters.

分号 ; 已被替换为单个 & 操作符以确保 react-script build 部分运行不管最初的 rd/s/q ... 命令是失败还是成功.

The semi-colon ; has been replaced with the single & operator to ensure the react-script build part runs regardless of whether the initial rd /s/q ... command fails or succeeds.

使用 rd 删除可能不存在的文件夹/路径时，控制台会打印以下错误消息:

The following error message would be printed to the console when using rd to delete a folder/path which may not exist:

系统找不到指定的路径

为了防止此错误消息可能被打印到控制台，我们使用 2>空 部分.

To prevent this error message from potentially being printed to the console we redirect the error message to NUL using the 2> nul part.

注意:上述语法将在基于 nix 的操作系统(例如 macOS 和 Linux)上失败.

Note: The above syntax will fail on nix based operating systems such as macOS and Linux.

要实现跨平台解决方案(即在 Windows、Linux 和 macOS 上成功运行的解决方案)，我建议编写两个 Nodejs 实用程序脚本来替代 rm -rf 和 mv bash 命令.然后可以通过 npm-script 调用这两个 Nodejs 脚本.

To achieve a cross platform solution, (i.e. one which runs successfully on Windows, Linux, and macOS), I suggest writing two Nodejs utility scripts to substitute the rm -rf and mv bash commands. These two Nodejs scripts can then be invoked via your npm-script.

以下步骤描述了如何实现这一点.

The following steps describe how this can be achieved.

1. 安装 shelljs，它为 Nodejs 提供可移植的 Unix shell 命令.为此，cd 到您的项目目录并运行以下命令:

1. Install shelljs which provides portable Unix shell commands for Nodejs. To do this, cd to your project directory an run the following command:

npm i -D shelljs

创建一个名为 rm.js 的新 Nodejs 脚本，内容如下:

Create a new Nodejs script named rm.js with the following content:

rm.js

const shell = require('shelljs');

const args = process.argv.slice(2);
const dir = args[0];

shell.rm('-rf', dir);

将此文件保存在项目目录的根目录中，与项目 package.json 的存储位置相同.

Save this file in the root of your project directory, at the same level as where your projects package.json is stored.

使用以下内容创建另一个名为 mv.js 的 Nodejs 脚本:

Create a another Nodejs script named mv.js with the following content:

mv.js

const shell = require('shelljs');

const args = process.argv.slice(2);
const src = args[0];
const dest = args[1];

// Check src path has been provided and is valid
if (!src || !shell.test('-d', src)) {
  console.log('\x1b[31m\x1b[40mERR!\x1b[0m src path cannot be found: %s', src);
  process.exit(1);
}

// Check dest path has been provided.
if (!dest) {
  console.log('\x1b[31m\x1b[40mERR!\x1b[0m dest path must be provided:');
  process.exit(1);
}

// Make dest directory if necessary.
shell.mkdir('-p', dest);

// Move the file.
shell.mv(src, dest);

还要将此文件保存在项目目录的根目录中，与项目 package.json 的存储位置相同.

Also save this file in the root of your project directory, at the same level as where your projects package.json is stored.

然后在 package.json 中配置您的 build 脚本，如下所示:

Then configure your build script in package.json as follows:

"scripts": {
  "build": "node rm \"deployment/static\" & react-scripts build && node mv \"build\" \"deployment/static\""
}

注意

在名为 build 的 npm-script 中调用了两个实用程序脚本 rm.js 和 mv.js> 通过零件读数；node rm ... 和 node mv ... 分别.

The two utility scripts rm.js and mv.js are invoked in the npm-script named build via the parts reading; node rm ... and node mv ... respectively.

如果您决定将这两个脚本存储在不同的文件夹而不是项目根目录中(如前面第 2 步和第 3 步中所建议的那样)，那么您需要更改文件的路径.例如;如果它们都保存在位于项目目录根目录下的名为 scripts 的文件夹中，那么您的 build 脚本将更改为:

If you decide to store these two scripts in a different folder instead of the projects root directory, (as suggested in steps 2 and 3 previously), then you'll need to change the paths to the files. For example; if they were both saved in a folder named scripts which is located in the root of your project directory then your build script would be changed to:

"scripts": {
  "build": "node scripts/rm \"deployment/static\" & react-scripts build && node scripts/mv \"build\" \"deployment/static\""
}

<小时>

编辑/更新:

另一种跨平台解决方案(最初发布此答案时不可用)是利用 shx 包，其描述为:

shx 是 ShellJS Unix 命令的包装器，提供了一个简单的npm 包脚本中简单的类 Unix、跨平台命令的解决方案

shx is a wrapper around ShellJS Unix commands, providing an easy solution for simple Unix-like, cross-platform commands in npm package scripts

1. 运行以下命令安装shx:

npm i -D shx

然后在 package.json 中更改您的构建脚本，如下所示:

Then change your build script in package.json as follows:

"scripts": {
  "build": "shx rm -rf deployment/static & react-scripts build && shx mv build deployment/static"
}

这篇关于在 windows 上配置 package.json的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！