Yeoman/Gulp throwing 'spawn gulp ENOENT' error on a Mac - angularjs

Please note: I do see this question as well as this one but those were both instances where the developer was on Windows, and the solution was Windows-specific. I am on a Mac! Please don't closevote as a duplicate!!!
Mac 10.12.6 here. I'm new to AngularJS (v1.x) and am trying to follow this tutorial on using Yeoman to create an internationalized AngularJS app.
I install the Yeoman AngularJS generator and create a directory for my simple/test app:
npm install -g generator-angular
mkdir angular-translate-yeoman && cd $_
Then I go to create my internationalization AngularJS app:
yo angular translate
It asks me a bunch of questions, I select gulp instead of grunt, and then starts generating the scaffolding. About a minute later I get the following error:
events.js:160
throw er; // Unhandled 'error' event
^
Error: spawn gulp ENOENT
at exports._errnoException (util.js:1020:11)
at Process.ChildProcess._handle.onexit (internal/child_process.js:193:32)
at onErrorNT (internal/child_process.js:367:16)
at _combinedTickCallback (internal/process/next_tick.js:80:11)
at process._tickCallback (internal/process/next_tick.js:104:9)
Anybody have any idea what the problem is and what the fix is?

I'm leaving this question up rather than deleting it. The problem was that I didn't have gulp installed, and the tutorial I was using never bothered to mentioned installing gulp as a pre-requisite. Not knowing anything about Yeoman, I guess I figured it would install any JS dependencies for me.
So this is the error you'll receive when you're on a Mac and using Yeoman + Gulp together, but Gulp isn't installed on your machine. To install Gulp:
npm install gulp-cli -g
npm install gulp -D
touch gulpfile.js
gulp --help

Related

"gatsby-plugin-sharp" plugin Couldn't be found when gatsby develop command is ran

Got a new pc and cloned my project from GitHub, then run npm install but then it installed with lots of errors, so now I ran gatsby develop and got the error messages below. please assist me
ERROR #10226 CONFIG
Couldn't find the "gatsby-plugin-sharp" plugin declared in "C:\Users\Administrator\Desktop\Projects\IamJude\gatsby-config.js".
Tried looking for a local plugin in C:\Users\Administrator\Desktop\Projects\IamJude\plugins\gatsby-plugin-sharp.
Tried looking for an installed package in the following paths:
C:\Users\Administrator\Desktop\Projects\IamJude\node_modules\gatsby\dist\bootstrap\load-themes\node_modules\gatsby-plugin-sharp
C:\Users\Administrator\Desktop\Projects\IamJude\node_modules\gatsby\dist\bootstrap\node_modules\gatsby-plugin-sharp
C:\Users\Administrator\Desktop\Projects\IamJude\node_modules\gatsby\dist\node_modules\gatsby-plugin-sharp
C:\Users\Administrator\Desktop\Projects\IamJude\node_modules\gatsby\node_modules\gatsby-plugin-sharp
C:\Users\Administrator\Desktop\Projects\IamJude\node_modules\gatsby-plugin-sharp
C:\Users\Administrator\Desktop\Projects\node_modules\gatsby-plugin-sharp
C:\Users\Administrator\Desktop\node_modules\gatsby-plugin-sharp
C:\Users\Administrator\node_modules\gatsby-plugin-sharp
C:\Users\node_modules\gatsby-plugin-sharp
C:\node_modules\gatsby-plugin-sharp
not finished open and validate gatsby-configs - 1.329s
ERROR
The above error occurred in the component:
in CLI (created by ConnectedCLI)
in ConnectedCLI
in StoreStateProvider
in App
React will try to recreate this component tree from scratch using the error boundary you provided, App.
ERROR
Warning: App: Error boundaries should implement getDerivedStateFromError(). In that method, return a state update to display an error message or fallback UI.
C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\node_modules\yoga-layout-prebuilt\yoga-layout\build\Release\nbind.js:53
throw ex;
^
TypeError: Cannot read property 'activities' of undefined
at getGlobalStatus (C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\lib\reporter\redux\utils.js:25:54)
at createPendingActivity (C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\lib\reporter\redux\internal-actions.js:114:51)
at C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\node_modules\redux\lib\redux.js:483:35
at prematureEnd (C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\lib\reporter\catch-exit-signals.js:39:38)
at Reporter.panic (C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\lib\reporter\reporter.js:72:42)
at process. (C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\lib\index.js:79:21)
at process.emit (events.js:327:22)
at processEmit (C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\node_modules\signal-exit\index.js:161:32)
at process.emit (C:\Users\Administrator\AppData\Roaming\npm\node_modules\gatsby-cli\node_modules#turist\fetch\dist\sourcemap-register.js:926:21)
at processEmit [as emit] (C:\Users\Administrator\Desktop\Projects\IamJude\node_modules\gatsby\node_modules\gatsby-cli\node_modules\signal-exit\index.js:161:32)
at processPromiseRejections (internal/process/promises.js:209:33)
at processTicksAndRejections (internal/process/task_queues.js:98:32)
What is the contents of your package.json?
Do you having gatsby-plugin-sharp installed?
Maybe try npm install --save gatsby-plugin-sharp
In Windows, you may need to make add a few extra packages to make the project run. First of all, I will try to add manually the gatsby-plugin-sharp by:
npm install --save gatsby-plugin-sharp
If the error persists, you may need to add windows-build-tools as you can see in the Gatsby on Windows documentation:
npm install --global windows-build-tools --vs2015
The command above, upon installing this package, it downloads and installs Visual C++ Build Tools 2015, provided free of charge by Microsoft. These tools are required to compile popular native modules. It will also install Python 2.7, configuring your machine and npm appropriately.
If your windows-build-tools installation stalls after Visual Studio Build Tools finishes, this remedy might help.

How to write Protractor test scripts using Typescript along with Jasmine framework in Visual studio Code?

My project is going from standalone to Web, Our new WebSite is getting created in AngularJS so Protractor is the tool selected for Test Automation.
I want to Integrate Typescript with dependencies of Jasmine and Node so that I don't get errors such as
cannot find name Describe
cannot find name it
cannot find name Expect
Can Anyone tell me how to add Jasmine and Protractor dependencies, so that when I hit ctrl + space i'll get all options available.
I have installed Typescript. And I am getting protractor dependencies such as browser, element, by etc.
What should i do for describe,it,expect (Jasmine stuffs) ?
I use Visual Studio Code everyday to write my scripts, it's my current favourite editor for Protractor because of its built in support for TypeScript!
Here are the following things which can come into my mind which could help you setup your framework-
Download the latest VS Code version - https://code.visualstudio.com/download
Install typescript globally npm install -g typescript
Install protractor globally npm install -g protractor
Create your project folder
Setup you project folder for git, node and typescript -
npm init -f // will create default package.json stating its nodejs project
git init // will create .git file, you project is now git project
tsc --init // will create tsconfig.json stating its typescript project
Install typings and dev dependencies-
npm install --save-dev protractor // this will install protractor as a dev dependency
npm install --save-dev typescript // this will install typescript as a dev dependency
npm install --save-dev #types/jasmine // jasmine typings
npm install --save-dev #types/node // node typings
At this point you have setup your basic protractor-typescript project and you can see all the typings and dependencies in package.json. Now you are good to write your typed scripts :).
Now compile your scripts by running -
tsc or tsc -w
After successfull compilation all your javascript files would be generated.
The run protractor
protractor config.js
You can also setup your vs code for debugging with protractor which I have mentioned here - Protractor -VS Code Debugging
For more details pls refer the TypeScript Tutorial, Protractor API
The Typescript error you are observing this is due to VS Code not recognizing global typescript 2.0 version.
To solve this open vscode go to preferences--> user settings --> settings.json will be opened and enter the highlighted path as shown
Save your file and restart VSCode now you are good to go :)
I agree with the answers given. Just want to share a hack with you.
You don't need to transpile your Typescript codes to JavaScript anymore.
Create a launch.js file
require('ts-node').register({
compilerOptions: {
module: 'commonjs'
},
disableWarnings: true,
fast: true
});
exports.config = require('./config/protractor.conf.ts').config;
And kick start protractor execution like:
> protractor launch
You can save yourself from the headache of transpiling every time you make a change to typescript files.
Happy testng!

Angular - Error: spawn cmd ENOENT

Hi I have problem when I generate angular - yo angular.
I'm all done. Running bower install & npm install for you to install the required dependencies. If this fails, try running the command yourself.
invoke angular:route
invoke angular:controller:C:\Users\david\AppData\Roaming\npm\node_modules\generator-angular\route\index.js
create app\scripts\controllers\about.js
events.js:85
throw er; // Unhandled 'error' event
^
Error: spawn cmd ENOENT
at exports._errnoException (util.js:746:11)
at Process.ChildProcess._handle.onexit (child_process.js:1053:32)
at child_process.js:1144:20
at process._tickCallback (node.js:355:11)
Anyone show me how to solve this issue? Thanks.
Im not sure why this error comes about, however i managed to run my Angular application by running with : ng serve instead of ng serve --open . Please not you will need to copy the url manually and place it in the browser afterwards which should be http://localhost:4200/
I got the same issue for windows 8 and tried several installations after doing changes to AppData/Roaming folder. None of the solutions worked for me. The issue is because of an environment variable of your system path is missing . Add "C:\Windows\System32\" value to your system PATH variable.
this error occurs when your terminal is not having access to open browers or admin permision try running your terminal as admin
I've got this issue after updating Angular CLI to 11.0.2 and I've been spent a lot of time to resolve this,
Apparently, I've tried the default port to serve my project and it served without any errors. which is http://localhost:4200/ but, I needed to run on http://localhost:8000/ So I did this....
First of all try remove node_modules from your directory and re-install npm packages. (I'm saying this because, some users got resolved the issue) to re-install npm packages, run
npm i
or run below command
npm install
if this didn't work, try adding the port number to the angular.json file.
search for serve options in the json file.
then add your desired port number like this "port": 8000,
(P.S. 'WorkspaceUI' means my project name and I've been trying to run on '8000' port. you can run on your own port number.) Then run your project using ng serve command. Thank you!
There are many guesses on different portal for this error and none of them works. Here is the solution -
Run this command to install angular cli before performing anything -
npm install -g #angular/cli

can't build yeoman angular app

I have a problem with building an angular js web app generated with yeoman angular generator. I can run the grunt serve, and it's completely fine. But when I tried to build the app using grunt, I got the following errors.
Running "concurrent:dist" (concurrent) task
Warning: Running "imagemin:dist" (imagemin) task
Warning: Error: spawn ENOENT in file app/images/yeoman.png Use --force to continue.
The thing is I can build that app (exactly the same app, just copy and paste) on other latop, using same OS, same npm version, same grunt version.
I'm using:
mac osx - v10.9.5
npm - v2.0.2
grunt-cli - v0.1.13
grunt - v0.4.5
yeoman - v1.2.1
Please, help me how to fix that error. thanks
You have to update imagemin. (You may edit imagemin version at your package.json).
I observed the same issue with imagemin 0.8.2. Imagemin 0.9.2 works fine for me.
Imagemin 0.9.2 require npm version >=2.1.5, you have to update npm too(npm install -g npm).

Yeoman - Errors With Grunt Server Command

I already have npm and git installed on my Ubuntu machine.
I followed the instructions below when installing Yeoman and the generator-angular.
Kickstart Your AngularJS Development with Yeoman, Grunt and Bower (step by step tutorial)
http://www.sitepoint.com/kickstart-your-angularjs-development-with-yeoman-grunt-and-bower/
My ultimate goal is to lauch a simple app using twitter bootstrap, so I can take advantage of their pretty UI. :D
However, when I get to the portion to run grunt server (recently replaced by grunt serve), I get a rediculous number of errors:
I was previously suffering from the issue described below:
Cannot install yeoman because 'generator-karma does not satisfy its siblings peerDependencies
https://github.com/yeoman/yeoman/issues/1065
Luckily I was able to work around it by running npm uninstall -g generator-karma && npm install -g generator-angular and then sudo npm install -g yo grunt-cli bower.
However, now I've hit a wall with grunt appearing as if it's not installed at all.
Does anyone know if there is a specific location where grunt should be installed?
Should I install it globally (using -g)?
Should I not install it globally (using -g)?
I don't understand what I'm doing incorrectly, but it must be something fundamental because the process is intended to be automated and simple.
Any ideas?
This looks like something npm install would fix. Looks like some of your dependencies didn't install.
Try it first without -g.
The problem definitely has something to do with compass and ruby. I was able to quickly build an angular app using yeoman when I opted not to install compass/sass for the app when prompted after typing yo angular at the terminal. After following the suggestions in this post, the last error I got was the following error:
Warning: /home/ubuntu/.rvm/rubies/rubie-2.1.1/lib/ruby/2.1.0/rubygems/core_ext/kernel_req‌​uire.rb:55:in 'require': cannot load such file -- compass (LoadError) from /home/ubuntu/.rvm/rubies/rubie-2.1.1/lib/ruby/2.1.0/rubygems/core_ext/kernel_req‌​uire.rb:55:in 'require' from /usr/bin/compass:20:in 'block in ' from /usr/bin/compass:8:in 'fallback_load_path' from /usr/bin/compass:19:in '' Use --force to continue Although, --force doesn't help.
but fixed it by simply following these instructions.

Resources