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

I am testing the sample code of javascript.
There is script like simple.js under demos directory.
I run demo by this command yarn build-demos && http-server demos/
simple.js is compiled 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.com/tensorflow/magenta-js.git"
}
}

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.

Related

Invalid package name "#" of package "##nestjs/passport": name can only contain URL-friendly characters

Creates a Module Federation applcation, API server, but when I running command npm install I am getting error. My node version is v16.17.1 and npm version is 8.19.2
╰─ npx create-mf-app ─╯
? Pick the name of your app: server
? Project Type: API Server
? Port number: 8080
? Template: nestjs-auth
Your 'server' project is ready to go.
Next steps:
▶️ cd server
▶️ npm install
▶️ npm start
Error:
npm ERR! code EINVALIDPACKAGENAME
npm ERR! Invalid package name "#" of package "##nestjs/passport": name can only contain URL-friendly characters.
Package.json
{
"name": "server",
"version": "1.0.0",
"description": "",
"author": "",
"private": true,
"license": "UNLICENSED",
"scripts": {
"prebuild": "rimraf dist",
"build": "nest build",
"format": "prettier --write \"src/**/*.ts\" \"test/**/*.ts\"",
"start": "nest start",
"start:dev": "nest start --watch",
"start:debug": "nest start --debug --watch",
"start:prod": "node dist/main",
"lint": "eslint \"{src,apps,libs,test}/**/*.ts\" --fix",
"test": "jest",
"test:watch": "jest --watch",
"test:cov": "jest --coverage",
"test:debug": "node --inspect-brk -r tsconfig-paths/register -r ts-node/register node_modules/.bin/jest --runInBand",
"test:e2e": "jest --config ./test/jest-e2e.json"
},
"dependencies": {
"#": "nestjs/passport",
"#nestjs/common": "^8.0.0",
"#nestjs/core": "^8.0.0",
"#nestjs/jwt": "^8.0.0",
"#nestjs/passport": "^8.0.1",
"#nestjs/platform-express": "^8.0.0",
"#nestjs/serve-static": "^2.2.2",
"class-validator": "^0.13.1",
"jsonwebtoken": "^8.5.1",
"passport": "^0.5.0",
"passport-jwt": "^4.0.0",
"passport-local": "^1.0.0",
"reflect-metadata": "^0.1.13",
"rimraf": "^3.0.2",
"rxjs": "^7.2.0"
},
"devDependencies": {
"#nestjs/cli": "^8.0.0",
"#nestjs/schematics": "^8.0.0",
"#nestjs/testing": "^8.0.0",
"#types/express": "^4.17.13",
"#types/jest": "^27.0.1",
"#types/node": "^16.0.0",
"#types/passport-jwt": "^3.0.6",
"#types/passport-local": "^1.0.34",
"#types/supertest": "^2.0.11",
"#typescript-eslint/eslint-plugin": "^4.28.2",
"#typescript-eslint/parser": "^4.28.2",
"eslint": "^7.30.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-prettier": "^3.4.0",
"jest": "^27.0.6",
"prettier": "^2.3.2",
"supertest": "^6.1.3",
"ts-jest": "^27.0.3",
"ts-loader": "^9.2.3",
"ts-node": "^10.0.0",
"tsconfig-paths": "^3.10.1",
"typescript": "^4.3.5"
},
"jest": {
"moduleFileExtensions": [
"js",
"json",
"ts"
],
"rootDir": "src",
"testRegex": ".*\\.spec\\.ts$",
"transform": {
"^.+\\.(t|j)s$": "ts-jest"
},
"collectCoverageFrom": [
"**/*.(t|j)s"
],
"coverageDirectory": "../coverage",
"testEnvironment": "node"
}
}
So as Micael Levi suggested I removed the "#": "nestjs/passport", entry from package.json and deleted package-lock.json file and run command npm install. It resolved the error.

Nuxt PWA with directory errors

After a while without playing with Nuxtjs today I decided to start a project on it with PWA support, everything installed and the template created almost as usual, just missing a relatively useless directory - assets -, but when I go to `yarn dev` several of these errors appear:
ERROR ENOENT: no such file or directory, open '/home/runner/anisite/node_modules/.cache/pwa/icon/iphonexsmax_1242x2688.png'
then at the end it appears:
Killed
error Command failed with exit code 137
My package.json
{
"name": "anisite",
"version": "1.0.0",
"private": true,
"scripts": {
"dev": "nuxt",
"build": "nuxt build",
"start": "nuxt start",
"generate": "nuxt generate",
"lint:js": "eslint --ext \".js,.vue\" --ignore-path .gitignore .",
"lint": "yarn lint:js",
"test": "jest"
},
"dependencies": {
"#nuxtjs/axios": "^5.13.6",
"#nuxtjs/pwa": "^3.3.5",
"core-js": "^3.15.1",
"nuxt": "^2.15.7"
},
"devDependencies": {
"#babel/eslint-parser": "^7.14.7",
"#nuxtjs/eslint-config": "^6.0.1",
"#nuxtjs/eslint-module": "^3.0.2",
"#nuxtjs/tailwindcss": "^4.2.0",
"#vue/test-utils": "^1.2.1",
"babel-core": "7.0.0-bridge.0",
"babel-jest": "^27.0.5",
"eslint": "^7.29.0",
"eslint-config-prettier": "^8.3.0",
"eslint-plugin-nuxt": "^2.0.0",
"eslint-plugin-vue": "^7.12.1",
"jest": "^27.0.5",
"postcss": "^8.3.5",
"prettier": "^2.3.2",
"vue-jest": "^3.0.4"
}
}
Edits:
I already deleted the cache directories
I already reinstalled everything

Jest not finding all tests

Jest is not finding all of my test files. It is ignoring a directory. When I run npm run jest:watch my tests in ./server and its subdirectories are tested but no tests are found in ./client
What I have tried
I have tried creating a generic test file and moving it around. I found it would work in the following circumstances.
I have also tried using a direct path to the file - which didn't work.
Possible causes
I think it may be something to do with the unusual directory structure I have
./client
./server
as opposed to
./server.js
./other server files..
./client/...client files
or it may be die to me trying to run jest from the node.js app and also have it look at files in the client directory (which contains an app written in React) - I don't care about running tests on react components (only modules). Alternatively it could be something to do with jest in the client directory messing things up.
filename
./server/middleware
./
./client
delete.test.js
found by jest
found by jest
not found
My setup
my folder structure looks like this
./
./client (react client app)
./client/package.json
./client/node_modules
package.json
node.modules
./server (node.js api app)
./server/package.json
my jest is running from the ./package.json file.
Other things I have tried
I have tried using direct paths for my file the below code works
"testMatch": ["<rootDir>/server/delete.test.js"],
but this code (in the folder I want) does not
"testMatch": ["<rootDir>/client/delete.test.js"],
code setup
./package.json
{
"name": "Infoshot",
"version": "0.0.4",
"description": "Research Tool",
"main": "cd ./server && server.js",
"scripts": {
"start": "cd ./server && node server.js",
"server": "cd ./server && nodemon server.js",
"client": "npm start --prefix ./client/",
"clientinstall": "npm install --prefix client",
"dev": "concurrently \"npm run server\" \"npm run client\"",
"heroku-postbuild": "cd ./client && NPM_CONFIG_PRODUCTION=false npm install && CI= npm run build",
"compile-saas": "node-sass ./client/src/scss/a_main.scss ./server/nodeClient/public/css/main.css -w",
"test": "jest",
"test:watch": "npm run test -- --watch"
},
"jest": {
"testEnvironment": "node",
"testPathIgnorePatterns": [
"./node_modules"
]
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"axios": "^0.21.0",
"bcryptjs": "^2.4.3",
"config": "^3.2.2",
"dotenv": "^8.2.0",
"ejs": "^3.1.5",
"enzyme": "^3.11.0",
"express": "^4.17.1",
"express-validator": "^6.2.0",
"ijavascript": "^5.2.0",
"jest": "^26.6.3",
"jsonwebtoken": "^8.5.1",
"mongoose": "^5.7.0",
"nodemailer": "^6.4.14",
"nodemailer-sendgrid": "^1.0.3"
},
"devDependencies": {
"concurrently": "^4.1.2",
"node-sass": "^5.0.0",
"nodemon": "^1.19.2"
}
}
delete.test.json
describe.only('DELETE TEST: getDocument', () => {
test('Say Hi', async () => {
const bum = 'bum';
expect(bum).toBe(bum);
});
});
./client/package.json
As I said earlier I don't think this is relavant as it is not be run as I am running jest from ./server with npm run jest:watch
{
"name": "client",
"version": "0.1.0",
"private": true,
"dependencies": {
"axios": "^0.19.0",
"config": "^3.3.2",
"dotenv": "^8.2.0",
"enzyme-adapter-react-16": "^1.15.3",
"node-sass": "^4.14.1",
"react": "^16.9.0",
"react-beautiful-dnd": "^13.0.0",
"react-dom": "^16.9.0",
"react-router-dom": "^5.0.1",
"react-scripts": "^3.4.4",
"react-transition-group": "^4.3.0",
"serve": "^11.3.2",
"styled-components": "^5.1.1",
"uuid": "^3.3.3"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test",
"eject": "react-scripts eject",
"previewProd": "react-scripts build && serve"
},
"jest": {
"collectCoverageFrom": [
"src/components/documentEditor/*.js",
"<rootDir>/server/",
"!<rootDir>/node_modules/",
"!<rootDir>/src/index.js",
"!<rootDir>/src/registerServiceWorker.js"
]
},
"eslintConfig": {
"extends": "react-app"
},
"browserslist": {
"production": [
">0.2%",
"not dead",
"not op_mini all"
],
"development": [
"last 1 chrome version",
"last 1 firefox version",
"last 1 safari version"
]
},
"proxy": "http://localhost:5000",
"devDependencies": {
"#testing-library/react": "^10.4.9"
}
}
I found that if I removed all the mentions of jest in the ./client/package.json and also replaced the ./package.json with
"collectCoverageFrom": [
"**/*.{js,jsx}",
"!**/node_modules/**"
]
it worked.

Node.js cli run a directory

I've just checked a node.js web framework called feathers.js. I followed the example
``` bash
$ npm install -g #feathersjs/cli
$ mkdir my-new-app
$ cd my-new-app/
$ feathers generate app
$ npm start
In the example package.json file, I found a script look like this: "start": "node src/". I read through node.js cli options, I didn't found anything relate. So, I want to know how that script work, because normally node.js cli run by node foo.js
edit:
Folder structure
package.json file
{
"name": "feathersjsExplore",
"description": "",
"version": "0.0.0",
"homepage": "",
"main": "src",
"keywords": [
"feathers"
],
"author": {
"name": "",
"email": ""
},
"contributors": [],
"bugs": {},
"directories": {
"lib": "src",
"test": "test/"
},
"engines": {
"node": "^8.0.0",
"npm": ">= 3.0.0"
},
"scripts": {
"test": "npm run eslint && npm run mocha",
"eslint": "eslint src/. test/. --config .eslintrc.json",
"dev": "nodemon src/",
"start": "node src/",
"mocha": "mocha test/ --recursive --exit"
},
"dependencies": {
"#feathersjs/configuration": "^2.0.2",
"#feathersjs/errors": "^3.3.2",
"#feathersjs/express": "^1.2.5",
"#feathersjs/feathers": "^3.2.1",
"compression": "^1.7.3",
"cors": "^2.8.4",
"helmet": "^3.13.0",
"serve-favicon": "^2.5.0",
"winston": "^3.0.0"
},
"devDependencies": {
"eslint": "^5.5.0",
"mocha": "^5.2.0",
"nodemon": "^1.18.4",
"request": "^2.88.0",
"request-promise": "^4.2.2"
}
}
It will run the index.js file in that folder or whatever is specified in the folder's package.json main property (https://docs.npmjs.com/files/package.json#main).
If none of that can be found an Error: Cannot find module will be thrown.
This is a similar logic to require('folder/') (see https://nodejs.org/api/modules.html#modules_folders_as_modules).

How to run babel-node on a Lerna monorepo?

I´m building my first monorepo using Lerna.
My lerna.json:
{
"lerna": "2.9.0",
"npmClient": "yarn",
"useWorkspaces": true,
"packages": [
"packages/*"
]
}
The lerna package.json is like:
{
"name": "monorepo",
"version": "1.0.0",
"workspaces": [
"packages/*"
],
"private": true,
"scripts": {
"start": "lerna exec -- start",
"server": "lerna exec -scope #monorepo/server -- server"
},
"devDependencies": {
"lerna": "^2.9.0"
}
}
And my project has the following package.json:
{
"name": "#monorepo/server",
"version": "1.0.0",
"private": true,
"scripts": {
"start": "concurrently \"babel-node start-server\" \"babel-node start-auth-client\" \"babel-node start-editor-client\"",
"server": "nodemon --exec \"babel-node start-server.js\"",
"lint": "eslint ."
},
"dependencies": {
"#babel/cli": "^6.24.1",
"#babel/core": "^6.25.0",
"#babel/plugin-transform-runtime": "^6.23.0",
"#babel/preset-env": "^1.6.1",
"#babel/preset-es2017": "^6.24.1",
"bcryptjs": "^2.4.3",
"body-parser": "^1.17.2",
"connect-mongo": "^2.0.0",
"crypto": "^1.0.1",
"express": "^4.15.3",
"express-graphql": "^0.6.12",
"graphql": "^0.13.1",
"graphql-relay": "^0.5.4",
"jwt-simple": "^0.5.1",
"mongoose": "^5.0.10",
"morgan": "^1.8.2",
"nodemailer": "^4.6.0",
"passport": "^0.4.0",
"passport-jwt": "^4.0.0",
"path": "^0.12.7",
"validator": "^9.1.1"
},
"devDependencies": {
"concurrently": "3.5.1",
"eslint": "^4.18.2",
"eslint-config-airbnb": "16.1.0",
"eslint-plugin-import": "2.9.0",
"eslint-plugin-jsx-a11y": "6.0.3",
"eslint-plugin-react": "7.7.0",
"fs-extra": "^5.0.0",
"node-fetch": "^2.1.1",
"nodemon": "^1.11.0"
},
"babel": {
"presets": [
"#babel/es2017",
"#babel/preset-env"
],
"plugins": [
"transform-runtime"
]
}
}
My problem is running the server application, issuing one of the following commands:
$ yarn start
yarn run v1.5.1
$ concurrently "babel-node start-server" "babel-node start-auth-client" "babel-node start-editor-client"
[0] 'babel-node' Program is not recognized as an internal or external command, operable program or batch file.
[1] 'babel-node' Program is not recognized as an internal or external command, operable program or batch file.
[2] 'babel-node' Program is not recognized as an internal or external command, operable program or batch file.
[2] babel-node start-editor-client exited with code 1
[1] babel-node start-auth-client exited with code 1
[0] babel-node start-server exited with code 1
error An unexpected error occurred: "Command failed.
Exit code: 1
Command: C:\\WINDOWS\\system32\\cmd.exe
Arguments: /d /s /c concurrently \"babel-node start-server\" \"babel-node start-auth-client\" \"babel-node start-editor-client\"
Directory: c:\\dev\\monorepo\\packages\\server
Output:
".
info If you think this is a bug, please open a bug report with the information provided in "c:\\dev\\monorepo\\packages\\server\\yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
I think this is due to the fact that all packages now reside at package root/node_modules.
Any ideas how to fix that?

Categories

Resources