Installing locally and globally a npm depency produces an error while executing the command line - npm

I am trying to install locally and globally a npm depency by using npm install -g ..
The package.json seems to be ok :
{
"private": true,
...
"main": "dist/main.js",
"bin": {
"gbts": "./dist/main.js"
},
"scripts": {
"build": "tsc"
},
...
"dependencies": {
"minimist": "^1.2.5",
"ora": "^5.1.0",
"ts2c": "^2.2.7",
"yargs": "^16.1.1"
},
"devDependencies": {
"#types/node": "^14.14.10",
"eslint": "6.8.0",
"install": "^0.13.0",
"npm": "^6.14.9",
"tslint": "^5.12.1",
"typescript": "^3.3.3"
}
}
This works perfetly, but when I invoke the command gbts, I still have this error pop in error on windows:
It occurs on the following line :
const parse = require("minimist");
I do not understand why this produce a syntax error, project's dependencies are missing?
Any solution in my case?

Related

Laravel's React Breeze ,Always can't run : npm run dev

The Vite doesn't work
Os:CentOs7
Laravel: 9.26.1
node: v16.17.0
npm: 8.15.0
I would like use new Laravel Project with React.js.
And try the plug-in Breeze for Authentication
I use the command
composer create-project laravel/laravel new-project
php artisan breeze:install
php artisan breeze:install react
npm install
npm run dev
At first all command successful complete , but when i use
npm run dev
the server told me
/tmp/dev-xxxxxx.sh: line 1: vite: command not found
and i try the solution
https://github.com/vitejs/vite/discussions/5432
and
https://github.com/vitejs/vite/issues/1215
that's all not work for me
this is package.json
{
"private": true,
"scripts": {
"dev": "vite",
"build": "vite build"
},
"devDependencies": {
"#headlessui/react": "^1.4.2",
"#inertiajs/inertia": "^0.11.0",
"#inertiajs/inertia-react": "^0.8.0",
"#inertiajs/progress": "^0.2.6",
"#tailwindcss/forms": "^0.5.2",
"#vitejs/plugin-react": "^2.0.0",
"alpinejs": "^3.4.2",
"autoprefixer": "^10.4.2",
"axios": "^0.27",
"laravel-vite-plugin": "^0.5.0",
"lodash": "^4.17.19",
"postcss": "^8.4.6",
"react": "^17.0.2",
"react-dom": "^17.0.2",
"tailwindcss": "^3.1.0"
},
"dependencies": {
"vite": "^3.0.9"
}
}
How should I do to resolve this question?
I find the question
i type before npm install
npm config set bin-links false
because CentOs7 have sym link error(bin-link to my laptop)
that can not install complete
so i should set bin-links to true
and
npm install vite
it's would solve the problem

Unable to start a micro front-end app in single-SPA application

I am facing error while trying to start sub-app in Single-SPA application. Basically, I am trying to develop a kind of util app (sub app in Single-SPA) which contains Sockjs, Stomp-client etc. I have removed node modules and package-lock.json and installed node modules again. When I try to start application I am facing below error.
Error:
[webpack-cli] Invalid options object. Dev Server has been initialized using an options object that does not match the API schema.
- options has an unknown property 'firewall'. These properties are valid:
object { allowedHosts?, bonjour?, client?, compress?, devMiddleware?, headers?, historyApiFallback?, host?, hot?, http2?, https?, ipc?, liveReload?, onAfterSetupMiddleware?, onBeforeSetupMiddleware?, onListening?, open?, port?, proxy?, setupExitSignals?, static?, watchFiles?, webSocketServer? }
- options.client has an unknown property 'host'. These properties are valid:
object { logging?, overlay?, progress?, webSocketTransport?, webSocketURL? }
Command used for running the app : npm start
package.json
{
"name": "#sudeep/livedoc",
"scripts": {
"start": "webpack serve",
"start:standalone": "webpack serve --env standalone",
"build": "webpack --mode=production",
"analyze": "webpack --mode=production --env analyze",
"lint": "eslint src --ext js,ts,tsx",
"format": "prettier --write .",
"check-format": "prettier --check .",
"prepare": "husky install",
"test": "cross-env BABEL_ENV=test jest --passWithNoTests",
"watch-tests": "cross-env BABEL_ENV=test jest --watch",
"coverage": "cross-env BABEL_ENV=test jest --coverage"
},
"devDependencies": {
"#babel/core": "^7.14.6",
"#babel/eslint-parser": "^7.14.7",
"#babel/plugin-transform-runtime": "^7.14.5",
"#babel/preset-env": "^7.14.7",
"#babel/preset-typescript": "^7.14.5",
"#babel/runtime": "^7.14.6",
"babel-jest": "^27.0.5",
"concurrently": "^6.2.0",
"cross-env": "^7.0.3",
"eslint": "^7.29.0",
"eslint-config-prettier": "^8.3.0",
"eslint-config-ts-important-stuff": "^1.1.0",
"eslint-plugin-prettier": "^3.4.0",
"husky": "^6.0.0",
"identity-obj-proxy": "^3.0.0",
"jest": "^27.0.5",
"jest-cli": "^27.0.5",
"prettier": "^2.3.2",
"pretty-quick": "^3.1.1",
"ts-config-single-spa": "^2.0.1",
"typescript": "^4.3.4",
"webpack": "^5.40.0",
"webpack-cli": "^4.7.2",
"webpack-config-single-spa": "^4.0.0",
"webpack-config-single-spa-ts": "^2.2.2",
"webpack-dev-server": "^3.11.2",
"webpack-merge": "^5.8.0"
},
"dependencies": {
"#types/jest": "^26.0.23",
"#types/systemjs": "^6.1.0",
"#types/webpack-env": "^1.16.0",
"fast-json-patch": "3.0.0-1",
"rxjs": "6.6.0",
"stompjs": "2.3.3",
"sockjs-client": "1.5.0"
}
}
I resolved this problem by updating "webpack-config-single-spa-ts" from 2.0.0 to 3.0.0.
The firewall option has been renamed as of webpack-dev-server v4.0.0-rc.0
You should use allowedHosts instead of firewall.
This problem has been fixed in version 4.0.0 of webpack-config-single-spa
, so upgrading this package will fix your issue as well.
I had the same situation in React.
The package.json file for the project had:
"webpack-config-single-spa-react": "2.0.0",
Therefore, when I executed
npm i
npm installed the exact required version of this component (2.0.0). It is possible to verify the installed version, if you look under
./node_modules/webpack-config-single-spa-react/package.json
I manually deleted the folder webpack-config-single-spa-react.
Edited the package.json in my project to request a version above 3.0.0:
"webpack-config-single-spa-react": "^3.0.0",
executed "npm install"
verified that at least version 3.0.0 of the package was installed by looking at:
./node_modules/webpack-config-single-spa-react/package.json
The actions above resolved the problem.
Modify in your package.json this module webpack-dev-server to 4.0.0-beta.0 and rebuild.
My versions:
packages

Different svelte variable value for npm run dev and npm run build

I'm developing a svelte+tailwind+PHP site with rollup.js. How can I set a variable in the svelte source files depending on if I'm running npm run dev or npm run build? I'd like the different builds to connect to different back-end servers.
This is my package.json in case that's relevant. I'm new to most of these tools, so please bear with me and correct me if I've misunderstood too much. After running npm run build, I run a script that scp's the build folder to the production server.
{
"name": "my-app",
"version": "1.0.0",
"scripts": {
"watch:tailwind": "postcss public/tailwind.css -o public/index.css -w",
"build:tailwind": "NODE_ENV=production postcss public/tailwind.css -o public/index.css",
"dev": "run-p autobuild watch:tailwind",
"build": "npm run build:tailwind && rollup -c",
"start": "sirv public --single --host",
"start:dev": "sirv public --single --dev",
"autobuild": "rollup -c -w"
},
"devDependencies": {
"#rollup/plugin-commonjs": "^16.0.0",
"#rollup/plugin-node-resolve": "^10.0.0",
"autoprefixer": "^10.0.4",
"d3-interpolate": "^2.0.1",
"npm-run-all": "^4.1.5",
"postcss": "^8.1.10",
"postcss-cli": "^8.3.0",
"postcss-nested": "^5.0.1",
"postcss-reporter": "^7.0.2",
"rollup": "^2.3.4",
"rollup-plugin-css-only": "^3.0.0",
"rollup-plugin-livereload": "^2.0.0",
"rollup-plugin-svelte": "^7.0.0",
"rollup-plugin-terser": "^7.0.0",
"svelte": "^3.0.0",
"svelte-dnd-action": "^0.6.22",
"svelte-loading-spinners": "^0.1.1",
"tailwindcss": "^2.0.1"
},
"dependencies": {
"sirv-cli": "^1.0.0"
}
}
You can use #rollup/plugin-replace:
A Rollup plugin which replaces strings in files while bundling.
plugins: [
replace({
// alternatively, one could pass process.env.NODE_ENV or 'development` to stringify
'process.env.NODE_ENV': JSON.stringify('production')
})
]

How to add Webpack 3.8.1 to a Vue project

say I've go this scaffolding : https://github.com/vuejs/vue-cli
I want to add Webpack 3.8.1 to it.
there's already a "build" folder with lots of webpack files in it :
but (one of) the issue(s) is running "webpack" in the project's root returns :
https://webpack.js.org/concepts/ this si the doc I'm supposed to go by.
there's no real example.
it's got :
const path = require('path');
module.exports = {
entry: './path/to/my/entry/file.js',
output: {
path: path.resolve(__dirname, 'dist'),
filename: 'my-first-webpack.bundle.js'
}
};
which I adapted to the best of my ability to :
const path = require('path');
module.exports = {
entry: './src/entry.js',
output: {
path: path.resolve(entry, 'dist'),
filename: 'my-first-webpack.bundle.js'
}
};
I also added a entry.js file containing nothing under src :
and I edited my package.json file to include:
"dependencies": {
"vue": "^2.5.2",
"vue-router": "^3.0.1",
"node-sass": "^4.5.3",
"sass-loader": "^3.2.3",
"style-loader": "^0.19.0",
"extract-text-webpack-plugin": "^3.0.1"
},
"devDependencies": {
"sinon": "^4.0.1",
"webpack": "^3.6.0",
"webpack-dev-server": "^2.9.3",
"vue-loader": "^13.3.0",
"vue-style-loader": "^3.0.1",
and ran :
npm install
npm update
I feel I'm getting somewhat close but I still cannot manage to use the new webpack.
I put my comment as answer to be able to close this question and (hopefuly) help others future users.
I think that your problem is to try to use webpack, you should use the npm run script like: npm run dev or npm run prod, and then the vue+webpack will do the work for you, placing the files where the config says (webpack.base.dev.conf for instance).
If you take a look at package.json, you could see this part:
"scripts": {
"dev": "node build/dev-server.js",
"start": "node build/dev-server.js",
"build": "node build/build.js",
"unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
"e2e": "node test/e2e/runner.js",
"test": "npm run unit && npm run e2e",
"lint": "eslint --ext .js,.vue src test/unit/specs test/e2e/specs"
},
Every one can be executed with npm run X.
Hope it helps!

Jest - Unknow "preset" - "jest-react-native"

I'm using the following package.json (according to http://facebook.github.io/jest/docs/tutorial-react-native.html#content):
{
"scripts": {
"start": "node node_modules/react-native/local-cli/cli.js start",
"test": "jest",
},
"dependencies": {
"react": "^15.3.1",
"react-native": "0.31.0",
},
"devDependencies": {
"babel-jest": "^14.1.0",
"babel-preset-react-native": "^1.9.0",
"jest": "^14.1.0",
"jest-cli": "^13.1.0",
"jest-react-native": "^14.1.3",
"react-test-renderer": "^15.3.1"
},
"jest": {
"globals": {
"__DEV__": true,
"__RCTProfileIsProfiling": false
},
"preset": "jest-react-native"
}
}
But I get the error:
Error: Unknown config option "preset" with value "jest-react-native". This is either a typing error or another user mistake and fixing it will remove this message.
Using Jest CLI v13.2.3, jasmine2, babel-jest
FAIL __tests__/AuthorRequest-test.js (0s)
● Runtime Error
- Error: Cannot find module 'throwOnWrongReactAPI' from 'react-native.js'
at Resolver.resolveModule (node_modules/jest-cli/node_modules/jest-resolve/build/index.js:197:17)
at eval (node_modules/react-native/Libraries/react-native/react-native.js:180:26)
at Object.<anonymous> (node_modules/react-native/Libraries/react-native/react-native.js:189:4)
1 test suite failed, 0 tests passed (0 total in 1 test suite, run time 2.238s)
npm ERR! Test failed. See above for more details.
my .babelrc file contains:
{
"presets": ["react-native"]
}
I have a feeling that you are using a wrong version of Jest. You have:
"jest": "^14.1.0",
"jest-cli": "^13.1.0"
But it seems you have 13.2.3installed using npm -g:
Using Jest CLI v13.2.3, jasmine2, babel-jest
First of all, I think you can remove jest-cli and just use jest 14.1.0.
Then you can update your test script like:
"scripts": {
"test": "./node_modules/jest/bin/jest.js"
}
In this way, you make sure you run the local Jest copy of your project, so it should say now:
Using Jest CLI v14.1.0, jasmine2, babel-jest
Doing that and following the official docs you posted, it should be everything you need (Can't say for sure since you did not post the test code).