如何通过 npm 服务器自动重新加载脚本答案

【问题标题】：How to auto-reload the script by npm server如何通过 npm 服务器自动重新加载脚本
【发布时间】：2021-09-20 10:37:26
【问题描述】：

我正在测试javascript的示例代码。

demos目录下有simple.js之类的脚本。

我通过这个命令yarn build-demos && http-server demos/运行demo

simple.js 编译为simple_bundle.js 并且服务器工作。

但是每次我更改simple.js，我都需要重新启动服务器。

有没有什么好的捷径可以达到这个目的？？

我不熟悉npm和webpack

感谢任何帮助。

我的 package.json 在下面：

{
  "name": "@magenta/sketch",
  "version": "0.2.0",
  "description": "Make sketches in the browser with machine learning.",
  "main": "es5/index.js",
  "types": "es5/index.d.ts",
  "jsdelivr": "dist/magentasketch.js",
  "unpkg": "dist/magentasketch.js",
  "dependencies": {
    "@tensorflow/tfjs": "^1.0.2"
  },
  "devDependencies": {
    "@types/clone": "^0.1.30",
    "@types/file-saver": "^1.3.0",
    "@types/ndarray": "^1.0.6",
    "@types/node": "^12.0.1",
    "@types/tape": "^4.2.32",
    "browserify": "^16.5.1",
    "clang-format": "^1.2.3",
    "clone": "^1.0.4",
    "file-saver": "^1.3.8",
    "file-saver-typescript": "^1.0.1",
    "fs": "0.0.1-security",
    "http-server": "^0.12.1",
    "in-publish": "^2.0.0",
    "minimist": "^1.2.5",
    "path": "^0.12.7",
    "tape": "^4.9.0",
    "ts-loader": "^5.3.0",
    "ts-node": "^5.0.1",
    "tsify": "^3.0.4",
    "tslint": "^5.9.1",
    "typedoc": "^0.16.9",
    "typedoc-plugin-sourcefile-url": "^1.0.3",
    "typescript": "^3.3.3333",
    "webpack": "^4.24.0",
    "webpack-cli": "^3.1.2",
    "webpack-dev-server": "^3.1.14"
  },
  "scripts": {
    "prepublish": "yarn lint && yarn build && yarn bundle",
    "build": "tsc",
    "bundle": "webpack --config ./webpack/lib.config.ts",
    "lint": "tslint -c ../tslint.json -p . -t verbose",
    "test": "ts-node node_modules/tape/bin/tape src/**/*_test.ts",
    "build-demos": "webpack --config ./webpack/demo.config.ts",
    "run-demos": "yarn build-demos && http-server demos/",
    "serve-demos": "http-server demos/",
    "serve-dist": "http-server dist/",
    "docs": "sh ../scripts/generate-docs.sh 'sketch'"
  },
  "author": "Magenta",
  "license": "Apache-2.0",
  "repository": {
    "type": "git",
    "url": "https://github.com/tensorflow/magenta-js.git"
  }
}

【问题讨论】：

标签： javascript npm webpack

【解决方案1】：

您可能需要使用Nodemon。

你通过npm i nodemon安装nodemon
在 package.json 中添加一个脚本："dev": "nodemon dist/index.js"
通过添加npm run dev在控制台中执行代码

它应该按你的意愿工作

【讨论】：

非常感谢我使用了http-server，所以nodemon /Users/whitebear/.nvm/versions/node/v14.17.3/bin/http-server /demos 有效。

【解决方案2】：

您可以考虑使用Nodemon。

【讨论】：