javascript - How to auto-reload the script by npm server - Stack Overflow

admin管理员组

文章数量:1434893

I am testing the sample code of javascript.

There is script like simple.js under demos directory.

I run demo by this mand yarn build-demos && http-server demos/

simple.js is piled to simple_bundle.js and server works.

However everytime I change simple.js, I need to restart server.

Is there any good short cut for this purpose??

I am not familiar with npm and webpack

Any help is appreciated.

My package.json is here below:

{
  "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": ".git"
  }
}

I am testing the sample code of javascript.

There is script like simple.js under demos directory.

I run demo by this mand yarn build-demos && http-server demos/

simple.js is piled to simple_bundle.js and server works.

However everytime I change simple.js, I need to restart server.

Is there any good short cut for this purpose??

I am not familiar with npm and webpack

Any help is appreciated.

My package.json is here below:

{
  "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./tensorflow/magenta-js.git"
  }
}

• javascript
• npm
• webpack

Share Improve this question Follow edited Sep 20, 2021 at 13:41 RobC 25.1k2121 gold badges8484 silver badges8686 bronze badges asked Sep 20, 2021 at 10:37 whitebearwhitebear 12.5k2929 gold badges149149 silver badges301301 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

You might need to use Nodemon.

• You install nodemon by npm i nodemon
• In package.json you add a script: "dev": "nodemon dist/index.js"
• Execute the code in the console by adding npm run dev

It should work as you want

You may consider using Nodemon.

本文标签： javascriptHow to autoreload the script by npm serverStack Overflow