visual studio code not recognized parcel - parceljs

hey guys i new to parcel and i am trying to use parcel to build my website on it. i installed parcel using
npm install --save-dev parcel
but didnt work. then i ran parcel index.html and it returns
parcel : The term 'parcel' is not recognized as the name of a cmdlet,
function, script file, or operable program. Check the spelling of the name,
or if a path was included, verify that the path is correct and try again.
i tried uninstalling parcel and reinstalling but didnt work. Any ideas why this happens? thank you in advance.
below is my package.json
package.json
{
"dependencies": {
"dat.gui": "^0.7.7",
"gsap": "^3.6.0",
"load-asset": "^1.2.0",
"nice-color-palettes": "^3.0.0",
"three": "^0.126.1",
"vec2": "^1.6.1"
},
"devDependencies": {
"glslify-bundle": "^5.1.1",
"glslify-deps": "^1.3.2",
"parcel": "^2.0.1",
"parcel-bundler": "^1.12.5"
}
}

When you run npm install --save-dev parcel, you are installing local packages that are only intended to be used in this particular project, not everywhere on your computer (see docs). So commands associated with those packages aren't added to your CLI's global path by default. One way to run locally installed commands is to put them your package.json's "scripts" field:
{
...
"scripts": {
"build": "parcel index.html"
}
}
When they are run in that context, they'll have access to the locally installed packages.
I noticed another problem with your package.json - you have both parcel-bundler and parcel packages installed. parcel-bundler is the deprecated v1 version of parcel, and when it's installed side-by-side with the parcel (v2) package, it will override the parcel command in your scripts, so you'll be getting v1 instead of v2, which is probably not what you want. I'd recommend running npm uninstall parcel-bundler.

Related

VSCode git "npm command not found" [duplicate]

I've setup a node project with husky but when my collegue tries to run npm install on his Mac he gets the following error :
noa-be#1.0.0 prepare
husky install
sh: husky: command not found
npm ERR! code 127
npm ERR! path /Users/X/Desktop/Workspace/project
npm ERR! command failed
npm ERR! command sh -c husky install
npm ERR! A complete log of this run can be found in:
npm ERR! /Users/X/.npm/_logs/2021-04-12T13_07_25_842Z-debug.log
These are the relevant package.json parts:
{
"scripts": {
"prepare": "husky install"
},
"devDependencies": {
"husky": "^5.2.0",
}
}
I thought this would be enough for husky to be installed when running npm install, but it's not. What am I missing?
If you are using nvm, you might want to create a file called .huskyrc in your home directory and add the following lines of code to it:
~/.huskyrc
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
I was struggling with the same exact problem for hours. Finally, I could install dependencies and start working on my project by doing this:
Temporarily remove the "prepare": "husky install" script from the package.json file.
Run npm i (npm install). Dependencies installed successfuly.
Add again the "prepare" script that you removed in step 1.
Run again npm i to install the husky git hooks, so husky can do its job from now on.
This error is also thrown by npm ci if the NODE_ENV is set to "production" pre-install
I've been able to solve the problem by upgrading to latest Husky version (7.0.1, from 5.2.0).
Git was also helpful, and told me that the files weren't executables. (Git V 2.24.1)
So I give them executable rights :
chmod +x PATH_TO_HUSKY_FILE
You'll need to execute this command for every hooks
I believe it could be version specific issue. Install version 6, npm i husky#6.0.0 --save-dev, and it should work as the husky doc says.
Apparently, when I did npm i husky --save-dev, it was installing "husky": "^0.8.1" for me for some strange reason, giving me the exact same error: sh: husky: command not found.
Method 1:
Update manually, in your package.json:
{
"scripts": {
"prepare": "husky install",
"create-hook": "husky add .husky/pre-commit \"npm test\"",
}
}
Then, run npm run prepare && npm run create-hook.
It should create .husky directory with .pre-commit file in it.
Method 2:
npx husky install
npm set-script prepare "husky install"
npx husky add .husky/pre-commit "npm test"
It worked in my terminal but not in VSCode version control. So had to force quite the vscode app and restarting it worked.
Faced this issue in Github Desktop.
solved it by quit Github Desktop and re-open it.
I was able to fix this by providing an explicit location for husky
"scripts": {
"prepare": "node_modules/.bin/husky-run install"
},
Using Lerna
When I upgraded husky from version 4 to 8 there was information todo first pre commit manually. For this purpose pre-commit bash script was generated in .husky directory.
What I had todo was simply run the command included in this file:
lerna run precommit --concurrency 2 --stream

check-types or check-lint similar command to stylelint

When running a lint like Eslint, I can use the command npm run check-lint to check all the code on my project. The same goes with npm run check-types from typescript. Is there a similar command with stylelint? I didn't find anything on their docs about it. I know there is a --fix flag, but that's not exactly what I want.
These are npm run scripts, and unrelated to Stylelint itself. You can use run scripts to run any arbitrary command from a package's "scripts" object.
For example, to add a check-styles command to your project you should edit your package.json file and add:
{
"scripts": {
"check-styles": "stylelint \"**/*.css\""
}
}
You'll then be able to use npm run check-styles.

trying to install next js on VS code but show error by saying npm not recognized

I am trying to install next js in VS code, when I type 'npx create-next-app' in the powershell terminal in VS, it showed error by saying:
The term 'npx' is not recognized as the name of a cmdlet, function, script file, or operable program.Check the spelling of the name, or if a path was included, verify that the path is correct and try again.
I have already install node 10.13 like the documentation of next asked me to...
Here is a picture
It means npx is not installed in your machine please check or update your npm or installed npx first.
use this cmd to check if it is installed or not npx --version if not then update your node and npm version
as in your attachment, you did not pass the project name as you should provide the project name as well npx create-next-app myapp
When installed, try
npx create-next-app [name here]
cd my-project
Install node.js, helped me. Then check version. npx -v, then install it npx create-react-app my-app for example

Trying to run babel : "cannot find module #babel/core"

I'm trying to set up a build environment to explore react.
My build process uses gulp.
I installed packages like this:
npm install --save-dev gulp-babel#7 babel-core babel-preset-env
After discovering that I needed to install something related to babel and react I also ran:
npm install --save-dev #babel/preset-react
My .babelrc has this:
{ "presets": ["#babel/preset-react"] }
My gulpfile has this:
gulp.task('scripts', function() {
return gulp.src(['./src/js/main.js' ])
.pipe(babel({
presets : ['#babel/preset/react']
}))
.pipe(concat('test.js'))
.pipe(gulp.dest('./js'))
.pipe(uglify())
.pipe(rename('test.min.js'))
.pipe(gulp.dest('./js')) ;
});
When I run 'gulp scripts' I get this:
[22:51:14] Using gulpfile ~/play/learning-react-2/gulpfile.js
[22:51:14] Starting 'scripts'...
[22:51:14] 'scripts' errored after 59 ms
[22:51:14] Error in plugin "gulp-babel"
Message:
Cannot find module '#babel/core' (While processing preset: "/home/bob/play/learning-react-2/node_modules/#babel/preset-react/lib/index.js")
I deleted babel-core from node_modules, and reinstalled it using the command:
npm install --save-dev #babel/core
If I look at the contents of node_modules, I see these packages related to babel:
babel-code-frame/
babel-helper-builder-binary-assignment-operator-visitor/
babel-helper-call-delegate/
babel-helper-define-map/
babel-helper-explode-assignable-expression/
babel-helper-function-name/
babel-helper-get-function-arity/
babel-helper-hoist-variables/
babel-helper-optimise-call-expression/
babel-helper-regex/
babel-helper-remap-async-to-generator/
babel-helper-replace-supers/
babel-messages/
babel-plugin-check-es2015-constants/
babel-plugin-syntax-async-functions/
babel-plugin-syntax-exponentiation-operator/
babel-plugin-syntax-trailing-function-commas/
babel-plugin-transform-async-to-generator/
babel-plugin-transform-es2015-arrow-functions/
babel-plugin-transform-es2015-block-scoped-functions/
babel-plugin-transform-es2015-block-scoping/
babel-plugin-transform-es2015-classes/
babel-plugin-transform-es2015-computed-properties/
babel-plugin-transform-es2015-destructuring/
babel-plugin-transform-es2015-duplicate-keys/
babel-plugin-transform-es2015-for-of/
babel-plugin-transform-es2015-function-name/
babel-plugin-transform-es2015-literals/
babel-plugin-transform-es2015-modules-amd/
babel-plugin-transform-es2015-modules-commonjs/
babel-plugin-transform-es2015-modules-systemjs/
babel-plugin-transform-es2015-modules-umd/
babel-plugin-transform-es2015-object-super/
babel-plugin-transform-es2015-parameters/
babel-plugin-transform-es2015-shorthand-properties/
babel-plugin-transform-es2015-spread/
babel-plugin-transform-es2015-sticky-regex/
babel-plugin-transform-es2015-template-literals/
babel-plugin-transform-es2015-typeof-symbol/
babel-plugin-transform-es2015-unicode-regex/
babel-plugin-transform-exponentiation-operator/
babel-plugin-transform-regenerator/
babel-plugin-transform-strict-mode/
babel-preset-env/
babel-runtime/
babel-template/
babel-traverse/
babel-types/
I'm guessing that at least one of them is "babel core"
So... how do I actually run babel from gulp? How do I run it at all?
I had the same issue. I resolved it by removing node_modules and I reinstalled packages (with yarn OR npm install). The problem was fixed.
In case Victor's answer doesn't help, it may be worth a try to clean your machine's package cache by running npm cache clean/yarn cache clean or removing the cache folder manually.

How do I check which babel version is on my windows 10 OS?

I need help to find which version of Babel is on my Windows Machine. I have installed it using
npm install --save-dev babel-cli babel-preset-env.
How do I check which version is on my Windows OS?
After you finish installing Babel, your package.json file should look like this:
{
"name": "my-project",
"version": "1.0.0",
"devDependencies": {
"babel-cli": "^6.0.0"
}
}
So you can find your Babel version in this configuration file.
Try this at the command line:
npm list babel-cli
You can also check the version of babel-cli by finding the babel-cli folder in node_modules and looking at the version property of the package.json that is at the base of that folder.
If babel-cli was installed globally via -g flag of npm install, you could check the version by executing command babel --version.
Hopefully the helps!
As the babel is updated to babel 7,
check using
npm list #babel/cli
or
npm list #babel/core
possibly your local ./node_modules/.bin is not in $PATH check out
this previous question for further info.
babel --version
You can figure this out by typing in the command line:
babel --help, look over the output and you can see other options that you might need.
Good luck