How can I run an npm script installed in the root of a learn repo, from a child package? - npm

For instance, I want to run jest tests for one of my packages.
I set up the test script in the child package.json:
"test" : "jest"
However when I got to the package directory and run:
npm test
I get:
sh: jest: command not found
This makes sense because I've only installed jest in the root package since it is a dev dependency.
What do I need to do to make the npm package jest available in the child packages?

We're using an npm package called env-cmd https://www.npmjs.com/package/env-cmd to run scripts from root level in packages.
our root package.json looks something like this:
{
"name": "#myAwesomeApp/root",
"private": true,
"devDependencies": {
"env-cmd": "^10.1.0",
"lerna": "^5.0.0"
},
"dependencies": {
[...]
},
"workspaces": [
"packages/*"
],
"scripts": {
"internal:warning": "echo \"\n\t\\\\033[32m! ANY NOTIFICATION !\n\"",
"jest": "npm run internal:warning && env-cmd --silent lerna run test"
}
}

Related

#tanstack/react-table npm install

I want to try basic project from tanstack/react-table from
https://github.com/TanStack/table/tree/main/examples/react/basic
I am new in NPM. I am on Windows.
I wrote:
git clone https://github.com/TanStack/table.git
then I am going to the subfolder examples\react\basic
then I wrote:
npm install
and in subfolder "node_modules" only folders "react" and "react-dom" appeard.
There is package.json:
{
"name": "tanstack-table-example-basic",
"version": "0.0.0",
"private": true,
"scripts": {
"dev": "vite",
"build": "vite build",
"serve": "vite preview",
"start": "vite"
},
"dependencies": {
"#tanstack/react-table": "^8.2.6",
"react": "^18.2.0",
"react-dom": "^18.2.0"
},
"devDependencies": {
"#rollup/plugin-replace": "^4.0.0",
"#vitejs/plugin-react": "^1.1.3",
"vite": "^2.8.6"
}
}
Please, why the "#tanstack/react-table" package is not installed?
When I wrote:
npm start
I received message:
[ERROR] [plugin vite:dep-scan] Failed to resolve entry for package "#tanstack/react-table".
I tried to write:
npm install #tanstack/react-table -g
and folder "#tanstack/react-table" appeard in folder C:\Users...\AppData\Roaming\npm\node_modules. I copied it to project folder and start project and all was OK. But I think, it is not right way.
What am I doing bad, please?
do you want to add react-table to your own project or you just want to clone their project and run the samples ?
for the first one you should go to your project folder and write this in cmd
npm install #tanstack/react-table
for the second one you should clone their project then go to example folder
then write npm install in cmd
Edit 1
remove all the node_modules in any folder of project
run this command in main folder yarn install
run yarn install in folder examples/react/basic
run command npm start in basic folder
before start you should install yarn if you didn't have it

Unable to install WebPack CLI

I'm trying out webpack for the first time, but I cant even get past the installation of webpack-cli
I get this error
{ Error: Cannot find module 'webpack-cli'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:580:15)
at Function.Module._load (internal/modules/cjs/loader.js:506:25)
at Module.require (internal/modules/cjs/loader.js:636:17)
at require (internal/modules/cjs/helpers.js:20:18)
at runCommand.then (C:\Users\Henrik\AppData\Roaming\npm\node_modules\webpack\bin\webpack.js:142:5)
at process._tickCallback (internal/process/next_tick.js:68:7) code: 'MODULE_NOT_FOUND' }
When I run webpack it suggest to auto install it, but fails at that.
Any suggestions?
-- EDIT 1 --
My package.json looks like this:
{
"name": "webpacktest",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"webpack-cli": "^3.2.1",
"webpack-dev-server": "^3.1.14"
},
"dependencies": {}
}
I've tried running this : "npm install webpack-cli --save-dev" amongst various other suggestions found all over the web
Try this:
npm install -g --save-dev webpack-cli
Looks like you might be trying to use a global webpack package with a local webpack-cli package.
Try adding webpack to your devDependencies and running webpack from inside an npm/yarn script, and if that doesn't work try uninstalling your global webpack binary.
I executed your package.json and it worked without any errors
Try deleting the node_modules folder and run the comand npm install from the prompt

package.json: Just download dependency but do not install it

I'm about to write a yeoman generator where the whole template is hosted on a git repository. So the package.json of my yeoman generator looks like
{
"name": "generator-foo",
"version": "0.1.0",
"description": "",
"files": [
"generators"
],
"keywords": [
"yeoman-generator"
],
"dependencies": {
"foo-template": "git://somewhere-in-the-world/foo-template.git#0.1.0",
"chalk": "^1.1.3",
"yeoman-generator": "^1.1.1",
"yosay": "^2.0.0"
}
}
Is there any way to prevent npm install from installing the foo-template package, i.e. running any postinstall script just for this package? Instead, it should be just downloaded to node_modules.
As describe here, postinstall scripts can be disabled globally for npm using --ignore-scripts flag.
As a complete solution, I would move your explicit dependency to foo-template to your local postinstall section with ignore scripts enabled:
{
"name": "generator-foo",
...
"postinstall": "npm install --ignore-scripts git://somewhere-in-the-world/foo-template.git#0.1.0",
"peerDependencies": {
"foo-template": "git://somewhere-in-the-world/foo-template.git#0.1.0"
}
}
Note that to make sure the dependency is explicitly described, we should mark it as a peerDependency (e.g. prevents package removal on prune).

npm pre commit not working

I am using npm precommit hook, but it is not stopping a file with issues to be committed, nor am I getting the message "Pre commit checks" when I try to commit a file.
Package Json:
{
"name": "myfolder",
"version": "1.0.0",
"description": "",
"main": "",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 0",
"precommit-msg": "echo 'Pre-commit checks...' && exit 0",
"lint": "csslint global/css"
},
"author": "SR",
"license": "ISC",
"dependencies": {
"csslint": "^1.0.4",
"jshint": "^2.9.4",
"pre-commit": "^1.2.2"
},
"pre-commit": [
"precommit-msg",
"lint"
],
"devDependencies": {
"pre-commit": "^1.2.2"
}
}
Please, make sure that your 'package.json' file is in the same folder, where '.git' folder is (where git repository was initialized). When you install 'pre-commit' package, 'pre-commit' file should appear under '.git/hooks/'.
Just FYI I had this issue because the pre-commit file was missing in the hooks folder.
Running npm i pre-commit --save-dev again created the file and solved it for me.
Have't managed to implement it with few "pre-commit" NPM modules (#fastify/pre-commit, monorepo-staged-precommit) so implemented it "manually" with adding tools/pre-commit.sh file into repo with content like:
#!/bin/sh
DIR='web'
echo "Pre-commit actions (NPM tests for $DIR)..."
cd $DIR && npm run test
and updating package.json with:
"scripts": {
"test",
"install-precommit": "cp ../tools/pre-commit.sh ../.git/hooks/pre-commit"
This solution has some limitations (like instead of automatic installation need to ask somewhere in "README" about npm run install-precommit and I'm not sure how it would work on Windows especially without Git Bash) but it worked for me.
Notes:
Other pre-commit NPM packages either didn't work as well or asked for NVM and other extra tools which I don't want devs to install for such small task.
pre-commit.sh may has any name and don't be executable - "install-precommit" task and git care about.

GULP: gulp is not defined

As shown in the screen shot below I am not able to run gulp to concat the JavaScript files. Its saying that gulp is not defined.
I have tried the following commands:
npm install -g gulp
npm install gulp
npm install gulp --save-dev
I have also set the environment variables as following:
C:\Users\<user>\AppData\Roaming\npm;C:\Python27;C:\Users\<user>\AppData\Roaming\npm\node_modules;C:\Users\<user>\AppData\Roaming\npm\node_modules\gulp;
var concat = require('gulp-concat');
var rename = require('gulp-rename');
var uglify = require('gulp-uglify');
//script paths
var jsFiles = 'scripts/*.js',
jsDest = 'dist/scripts';
gulp.task('scripts', function() {
return gulp.src(jsFiles)
.pipe(concat('scripts.js'))
.pipe(gulp.dest(jsDest));
});
you just need to install and require gulp locally, you probably only installed it globally
At the command line
cd <project-root> && npm install --save-dev gulp
In your gulpfile.js
var gulp = require('gulp');
this is a different dependency than the command line dependency (that you installed globally). More specifically, it is the same NPM package, but the command line program will execute code usually from a different entry point in the NPM package then what require('X') will return.
If we go to the package.json file in the Gulp project on Github, it will tell the whole story:
{
"name": "gulp",
"description": "The streaming build system",
"version": "3.9.1",
"homepage": "http://gulpjs.com",
"repository": "gulpjs/gulp",
"author": "Fractal <contact#wearefractal.com> (http://wearefractal.com/)",
"tags": [ ],
"files": [
// ...
],
"bin": {
"gulp": "./bin/gulp.js"
},
"man": "gulp.1",
"dependencies": {
// ...
},
"devDependencies": {
// ...
},
"scripts": {
"prepublish": "marked-man --name gulp docs/CLI.md > gulp.1",
"lint": "eslint . && jscs *.js bin/ lib/ test/",
"pretest": "npm run lint",
},
"engines": {
"node": ">= 0.9"
},
"license": "MIT"
}
so at the command line:
$ gulp default
will execute this:
"bin": {
"gulp": "./bin/gulp.js"
},
on the other hand, require('gulp') in your code will return the value of this:
https://github.com/gulpjs/gulp/blob/master/index.js
normally we see this in a package.json file as:
"main": "index.js"
but since this is the default, they just omitted it (which is dumb IMO, better to be explicit, but they aren't the first project I have seen take the lame shorthand route.).
Its occurs on Windows and usually one of the following fixes it:
If you didn't, run npm install gulp on the project folder, even if
you have gulp installed globally.
Normally, It isn't a problem on Windows, but it could be a issue with
the PATH. The package will try to get the PATH from the environment,
but you can override it by adding exec_args to your gulp settings.
For example, on Ubuntu:
"exec_args": {
"path": "/bin:/usr/bin:/usr/local/bin"
}
Hope It will be OK.
Source: https://github.com/NicoSantangelo/sublime-gulp/issues/12