从 npm 脚本在浏览器中打开一个 html 文件答案

【问题标题】：Opening a html file in the browser from npm script从 npm 脚本在浏览器中打开一个 html 文件
【发布时间】：2020-06-28 20:05:09
【问题描述】：

我能找到的所有解决方案都需要安装一个 npm 包，该包将启动一个 http 服务器来托管文件。然而，我唯一的要求是通过 npm 脚本从本地计算机打开一个非常简单的生成 html 文件到浏览器中，不需要服务器，这在没有包的情况下是否可行？

【问题讨论】：

这能回答你的问题吗？ How to use nodejs to open default browser and navigate to a specific URL 特别是第二个答案 - 它建议的解决方案没有包依赖。
关于我之前的评论，如果您在脚本中生成 HTML，您首先需要将内容写入文件。 fs.mkdtemp 可能对你有用。
我正在尝试通过没有 javascript 的脚本来执行此操作，我发现我可以创建一个内容为 "start chrome "$(realpath "./jest/report.html")" 的 bash 脚本" 然后从节点运行该脚本
在 macOS 上，npm-scripts 使用的默认 shell 是 sh。因此，您可以在 npm 脚本中使用内置的 open 实用程序。例如，您可以在 package.json 的 scripts 部分定义以下 npm 脚本："quux": "open -a \"Safari\" ./path/to/index.html" - 然后运行 npm run quux - 注意：您可以更改“将上述 npm 脚本中的“Safari”部分复制到另一个首选浏览器，例如 Google Chrome 等。还要确保您根据需要重新定义了 /path/to/index.html 部分。。对于 x 平台解决方案，您需要使用 node.js

标签： html node.js npm hosting

【解决方案1】：

发现我可以创建一个包含内容的 bash 脚本

#!/bin/bash
start chrome "$(realpath "./jest/report.html")"

然后使用

运行它

"test": "jest && bash ./open-browser.sh"

【讨论】：

考虑将 bash 代码内联到 npm 脚本本身以避免使用单独的文件。例如："test": "jest && bash -c \"start chrome \"$(realpath ./jest/report.html)\"\""
不是跨浏览器解决方案
这个问题并没有要求跨浏览器解决方案，只是如何在没有包的情况下做到这一点

【解决方案2】：

假设你的节点脚本和 index.html 在同一个文件夹中

const open = require('open');

(async () => {
        await open('index.html', {"wait": true });
})();

看看这个包：https://www.npmjs.com/package/open

【讨论】：

【解决方案3】：

最简单的方法是安装open 包

npm i open --save-dev

并像这样在 package.json 脚本对象中使用它

{
  "name": "somename",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "open-my-html": "open path/to/your/index.html",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "devDependencies: {
    "open": "^7.3.0"
  },
  "author": "",
  "license": "ISC"
}

然后运行

npm run open-my-html

【讨论】：

在问题中它询问是否有办法在没有包的情况下做到这一点

【解决方案4】：

我尝试了丹尼尔的答案，但它对我不起作用。

根据他的回答，我找到了open-cli 包。

npm i -D open-cli

并像这样在 package.json 脚本对象中使用它 (open-cli)

{
  "name": "somename",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    "open-my-html": "open-cli path/to/your/index.html",
    "test": "echo \"Error: no test specified\" && exit 1"
  },
  "devDependencies: {
    "open-cli": "^6.0.1"
  },
  "author": "",
  "license": "ISC"
}

然后运行

npm run open-my-html

现在它可以在默认浏览器上打开 html 文件了。

【讨论】：