在Windows上配置package.json

Question

在Windows上配置package.json

reactjsnpmpackage.jsonyarnpkgnpm-scripts

8

我正在尝试在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代替，但似乎无法正常工作。我收到了错误消息：Parameter format not correct - "static"。

- izengod

你是在寻找一个仅限于Windows的替代方案吗？还是你需要一种可以确保你的build脚本在所有平台（如Windows/Linux/Mac）上成功运行的解决方案？ - RobC

@RobC 在 Mac 上运行良好。我正在寻找 Windows 的解决方案。 - izengod

4个回答

2

为此，我使用rimraf。请全局安装它。

    npm i -g rimraf

并更新您的脚本如下所示。

    "rimraf deployment/static;react-scripts build && mv build deployment/static"

- adam_th

$ rimraf deployment/static;react-scripts build && move build deployment/static 系统找不到指定的文件。错误：命令以退出代码1失败。 - izengod

1

shx包应该能很好地工作；他们甚至在最顶层的package.json演示中展示了rm -rf

我的一些同事使用rimraf，它专门用于node的rm -rf unix命令

- neaumusic

0

针对Windows操作系统：

在客户端文件夹中

  },
  "scripts": {
    "build-win": "react-scripts build && move build ..\\server\\public",
  },

这将把文件夹移动到服务器文件夹中

- Igor Z

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- RobC · Accepted Answer

Windows解决方案（cmd.exe）

在Windows上通过命令提示符或PowerShell运行该build脚本的等效方式为：

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

说明：

Windows（cmd.exe）中的rm-rf等效命令是rd /s/q。
Windows（cmd.exe）中的mv等效命令是move。
所有目录路径都已包含在转义双引号\"...\"中。例如;

deployment/static已被重写为\"deployment/static\"。

虽然在这种情况下不完全需要转义双引号，但这是一个好习惯，并且当路径可能包含空格或标点符号时必须这样做。
分号;已被替换为单个&运算符，以确保无论初始rd /s/q ...命令成功还是失败，react-script build部分都将运行。
使用rd删除可能不存在的文件夹/路径时，将打印以下错误消息：

系统找不到指定的路径

为了防止潜在地将此错误消息打印到控制台上，我们使用2> nul将错误消息重定向到NUL。
md \"deployment/static\"部分使用Windows的md命令创建static目录，这与bash中的mkdir命令非常相似。

注意：上述语法在基于nix的操作系统（如macOS和Linux）上将失败。

跨平台解决方案（Windows/Linux/macOS...）

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

以下步骤描述了如何实现此目标。

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
```
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);
```
Save this file in the root of your project directory, at the same level as where your projects package.json is stored.

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);

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

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

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

注意

这两个实用程序脚本rm.js和mv.js通过读取部分在名为build的npm-script中调用;node rm ...和node mv ...分别。

如果您决定将这两个脚本存储在与项目根目录不同的文件夹中（如先前的步骤2和3中建议的），则需要更改文件的路径。例如;如果它们都保存在名为scripts的文件夹中，该文件夹位于项目目录的根目录中，则会更改您的build脚本：

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

编辑/更新:

当初发布这个答案时，还没有另一种跨平台的解决方案可供选择。现在可以使用shx包，该包被描述为：

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

Run the following command to install shx:
```
npm i -D shx
```

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"
}