I am trying to use Grunt to minify and compress my HTML, CSS and JavaScript files. However, I am hitting a roadblock with npm init. I have installed NodeJS and GruntCLI correctly. This is what I get when I enter the command npm init --verbose
is this ok? (yes)
npm info init written successfully
npm verb exit [ 0, true ]
and then it just hangs for hours. npm is stored in the path /c/Program Files/nodejs/npm. npm version is 2.15.5, NodeJS version is v4.4.5.
Any help will be greatly appreciated.
Thanks
Related
I want to program a Minecraft Bedrock Addon with JavaScript, just installed these packages "npm install -g yo" and "npm install -g generator-minecraft-addon". This all worked great. Now I want to continue with the settings of the mod, for this I have entered "yo minecraft-addon" in the terminal and this error message appears:
https://i.stack.imgur.com/oUezi.png
This is the error message.
I hope you can read it. Thanks in advance.
Create a package.
json file, on the command line, in the root directory of your Node. js module, run npm init : For scoped modules, run npm init --scope=#scope-name. For unscoped modules, run npm init.
I installed npm-run-all and also configured the environment variable (which may or may not be not required) on my Windows machine but am getting an error:
'npm-run-all' is not recognized as an internal or external command,
operable program or batch file
I am trying to build my current project with npm run build which includes the script where the error is thrown:
npm-run-all -p build-css build-webpack
Do I have to do any additional things to make it run?
Make sure the npm-run-all is in your package.json devDependencies.
If npm-run-all is present in your package.json, run npm i
If not present install it, run: npm i npm-run-all -D
If error is still present, follow these steps:
Remove node_modules folder: run rm -rf node_modules
Install all dependecies: run npm i
Hope this helps!
You may just need to run the following command first (from the directory with the package.json file)
npm install
Please do that like this.
npm i npm-run-all -g
And then this issue will be fixed.
You have a couple of options here, besides installing npm-run-all as a global package as suggested by #Vaibhav in the comments:
1) Create an NPM script
The package.json file has a scripts section which can used to define shortcuts for anything you need to run while you're working on your app. There are some pre-defined scripts, like run or test than can be executed with simply npm start/npm test or you can define anything you like and then run it with npm run my-script-name. You could try:
{
"scripts": {
"start": "npm-run-all -p build-css build-webpack"
}
}
Any NPM module referenced here "just works" (i.e. the path to the executable is resolved under the hood by NPM)
2) NPX
In newer versions of NPM (i.e. >= 5.2 or so), the "NPX" executable is provided. This has a similar effect to running commands inside an NPM script. You would run:
npx npm-run-all -p build-css build-webpack
Again, the path would be automatically resolved.
If you have an older NPM install, you can also install it separately:
npm install -g npx
npm install -g npm-run-all
Works for me.
Double check if npm-run-all is in your package.json devDependencies.
I had same problem while using code editor Brackets.
To resolve the error, I did the following steps.
Add nodejs new system variable to your PC under Control Panel -> System -> Advanced System Settings
;C:\Program Files\nodejs\
After that, re-run command:
npm
I don't know if this would help anyone, but I got this error because I was doing nodemon server.js instead of nodemon server/server.js. I wasn't in the right folder!
Did you reopen the terminal after you installed node?
If you have installed npm with the current terminal window open. Your terminal window will not have loaded the latest path settings (with npm location) to find the npm application to run the command. In this case try below steps .
Try closing the current terminal session.
Reopen a new session.
Try the command again ( will pick up the new path settings with npm installed)
This worked for me.
npm audit fix --force
Also you can try downgrading your autoprefixer, seems version 10.0.0 doesn't work well with postcss
npm i autoprefixer#9.8.6
I am trying to create a new react-app and start it, I have created react apps before with no errors but this time when i npm start i get this error
There might be a problem with the project dependency tree.
It is likely not a bug in Create React App, but something you need to fix
locally.
The react-scripts package provided by Create React App requires a
dependency:
"webpack-dev-server": "3.1.14"
Don't try to install it manually: your package manager does it
automatically.
However, a different version of webpack-dev-server was detected higher up
in the tree:
C:\Users\ashraf\node_modules\webpack-dev-server (version: 3.1.9)
Manually installing incompatible versions is known to cause hard-to-debug
issues.
If you would prefer to ignore this check, add SKIP_PREFLIGHT_CHECK=true to
an .env file in your project.
That will permanently disable this message but you might encounter other
issues.
To fix the dependency tree, try following the steps below in the exact
order:
1. Delete package-lock.json (not package.json!) and/or yarn.lock in your
project folder.
2. Delete node_modules in your project folder.
3. Remove "webpack-dev-server" from dependencies and/or devDependencies in
the package.json file in your project folder.
4. Run npm install or yarn, depending on the package manager you use.
In most cases, this should be enough to fix the problem.
If this has not helped, there are a few other things you can try:
5. If you used npm, install yarn (http://yarnpkg.com/) and repeat the
above steps with it instead.
This may help because npm has known issues with package hoisting which may
get resolved in future versions.
6. Check if C:\Users\ashraf\node_modules\webpack-dev-server is outside
your project directory.
For example, you might have accidentally installed something in your home
folder.
7. Try running npm ls webpack-dev-server in your project folder.
This will tell you which other package (apart from the expected react-
scripts) installed webpack-dev-server.
If nothing else helps, add SKIP_PREFLIGHT_CHECK=true to an .env file in
your project.
That would permanently disable this preflight check in case you want to
proceed anyway.
P.S. We know this message is long but please read the steps above :-) We
hope you find them helpful!
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! learnreact#0.1.0 start: `react-scripts start`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the learnreact#0.1.0 start script.
npm ERR! This is probably not a problem with npm. There is likely
additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! C:\Users\ashraf\AppData\Roaming\npm-cache\_logs\2019-02-
04T20_36_39_924Z-debug.log
PS C:\Users\ashraf\Desktop\Files\LearnReact\learnreact>
i have tried all the steps in detail in the error log but its still not working, any thoughts on what is causing this error? Thanks in advance
It seems like you want to depend on webpack-dev-server inside your local project.
Perhaps you need to run npm install in your project, instead of your ~ home directory?
from your output, notice these lines.
However, a different version of webpack-dev-server was detected higher up
in the tree:
C:\Users\ashraf\node_modules\webpack-dev-server (version: 3.1.9)
...
6. Check if C:\Users\ashraf\node_modules\webpack-dev-server is outside
your project directory.
For example, you might have accidentally installed something in your home
folder.
so I would
cd ./my-project
npm i
Did you install webpack-dev-server on its own? It seems it has been installed either by you or by another project install. Webpack is for your local development environment so the other install is close enough to your project to interfere with the copy that react is trying to install in your project folder. Steps 1-4 in your error message should resolve your issue. If you have done that and its still not working, did you get different error messages with your next attempt to install your react package?
I have faced the same issue and this method worked for me.
Do follow the steps:
Start terminal from the desktop and write this command:
npm uninstall webpack-dev-server
This will uninstall webpack-dev-server package globally from you node modules.
Go back to you the terminal of your project and install webpack-dev-server package:
npm install webpack-dev-server#version
Note: The version part (above) should equal the versions asked for in the error message.
npm install webpack-dev-server
Now start npm:
npm start
This error mostly occurs when you have created your project using the
npx create-react-app command instead of the npm create-react-app command.
I am running a windows 8.1 64-bit machine.
Node and npm were installed.(latest versions 0.12.x and 2.7.x)
Installed YO BOWER GRUNT-CLI GULP GENERATOR-ANGULAR correctly.
Now when I run "yo angular", the project files are being generated and bower install and npm install` are running. Till now its fine.
bower install goes well. But npm install stuck in middle and gives different ERR (sample - ERR registry parsing json sometimes different) and finally it freezes executing phantomjs.exe forever. If I quit that cmd prompt and run grunt in that folder, it says grunt not installed.
This happened every time I run this. Tried almost all googled suggestions. One more thing is that I cannot delete that folders created by yo angular.
Kindly help me run it completely
I'm working with Mac OS X 10.7.5 and I'm using Grunt to concate some js files and minify them. Now I want to also minify my css files. As grunt does not provide any functionality I wanted to install a grunt plugin for that.
According to the instructions i have to cd into my projects root folder and install the plugin with npm. So I did the following:
cd <PROJECT_ROOT>
npm install grunt-contrib-css
The instructions for the plugin are here: https://npmjs.org/package/grunt-contrib-mincss
The I opened my grunt.js file and added
grunt.loadNpmTasks('grunt-contrib-mincss');
But when I try to run grunt I just get
Local Npm module "grunt-contrib-mincss" not found. Is it installed?
<WARN> Task "mincss" not found. Use --force to continue. </WARN>
The installation works without any problem and npm ls does list the module.
Any ideas what I have done wrong? Many Thanks!
UPDATED
When I cd into a project like so
cd ~/Sites/path/to/project
and then install the plugin
sudo npm install grunt-contrib-mincss
the module is actually installed in
~/node_modules/grunt-contrib-mincss
I could hard copy the files into my projects root directory (which works) but it's kind of strange isn't it?
UPDATE 2
I've updated node and tried it again. Below is the console output.
me:~ Fritz$ node -v
v0.8.10
me:~ Fritz$ npm -v
1.1.62
me:~ Fritz$ mkdir ./Sites/npm-test
me:~ Fritz$ cd ./Sites/npm-test/
me:npm-test Fritz$ sudo npm install grunt-contrib-mincss
Password:
npm http GET https://registry.npmjs.org/grunt-contrib-mincss
npm http 304 https://registry.npmjs.org/grunt-contrib-mincss
npm http GET https://registry.npmjs.org/gzip-js
npm http GET https://registry.npmjs.org/clean-css
npm http GET https://registry.npmjs.org/grunt-contrib-lib
npm http 304 https://registry.npmjs.org/gzip-js
npm http 304 https://registry.npmjs.org/clean-css
npm http 304 https://registry.npmjs.org/grunt-contrib-lib
npm http GET https://registry.npmjs.org/crc32
npm http GET https://registry.npmjs.org/deflate-js
npm http GET https://registry.npmjs.org/optimist
npm http 304 https://registry.npmjs.org/deflate-js
npm http 304 https://registry.npmjs.org/crc32
npm http 304 https://registry.npmjs.org/optimist
npm http GET https://registry.npmjs.org/wordwrap
npm http 304 https://registry.npmjs.org/wordwrap
grunt-contrib-mincss#0.3.0 ../../node_modules/grunt-contrib-mincss
├── grunt-contrib-lib#0.3.0
├── gzip-js#0.3.1 (crc32#0.2.2, deflate-js#0.2.2)
└── clean-css#0.4.2 (optimist#0.3.4)
Why is the plugin installed outside? Or is there a way to define the actual location where it is installed?
I had a similar issue on Ubuntu 12.04 for the module grunt-jasmine-task (same error message as above). This solved the issue for me:
Manually create the folder node_modules in the root of the project.
Run npm install grunt-jasmine-task again.
This way to install worked for me:
cd <PROJECT_ROOT>.
Run npm install grunt-contrib-mincss.
Created test file in the current dir with the following testing content:
module.exports = function(grunt) {
grunt.initConfig({
mincss: {
compress: {
files: {
"path/to/output.css": ["path/to/input_one.css", "path/to/input_two.css"]
}
}
}
});
grunt.loadNpmTasks('grunt-contrib-mincss');
grunt.registerTask('default', 'mincss');
};
My directory structure looks like this at this moment (please check this, if some files are not there or in some other folder, then it can be reason why it doesn't work):
<PROJECT_ROOT> /
node_modules /
grunt-contrib-mincss/
grunt.js
Run grunt in terminal.
Script worked.
Possible reasons why it didn't work in your case:
You installed plugin globally (with -g argument).
You installed it in some subfolder (grunt.js and node_modules must be in the same folder).
Please check it.
I have seen cases where not having a package.json file present caused the modules to be installed globally. I'm not sure what version was running at the time, as it was not my machine.
Next time try running npm init prior to installing modules. After that, install using npm install grunt-contrib-css --save to have it added to your package.json file. You can also use --save-dev to have it added to your devDependencies.
In my case, I forgot to add:
grunt.loadNpmTasks('grunt-jsdoc-plugin');
to grunt.js, so it should look like this:
module.exports = function(grunt) {
// Project configuration.
grunt.initConfig({
jsdoc : {
dist : {
src: ['frontend/js/**/*.js'],
dest: 'docs/frontend'
}
}
});
grunt.loadNpmTasks('grunt-jsdoc-plugin');
};
If you take a look under the grunt-contrib-mincss folder, there is a readme file, they changed name from grunt-contrib-mincss to grunt-contrib-cssmin.
anyway, it's not your(and mine) fault. XD