Related
This question already has answers here:
Angular 6 - Could not find module "#angular-devkit/build-angular"
(47 answers)
Closed 8 months ago.
I tried to update the angular CLI following this, but now I can't run my app. When I try to run the command ng serve, it gives me this error:
Could not find the implementation for builder #angular-devkit/build-angular:dev-server
Error: Could not find the implementation for builder #angular-devkit/build-angular:dev-server
at WorkspaceNodeModulesArchitectHost.resolveBuilder (C:\Users\Lupus\Documents\full-stack-projects\financial-app-ui\node_modules\#angular\cli\node_modules\#angular-devkit\architect\node\node-modules-architect-host.js:49:19)
at ServeCommand.initialize (C:\Users\Lupus\Documents\full-stack-projects\financial-app-ui\node_modules\#angular\cli\models\architect-command.js:135:55)
at process._tickCallback (internal/process/next_tick.js:68:7)
at Function.Module.runMain (internal/modules/cjs/loader.js:745:11)
at startup (internal/bootstrap/node.js:283:19)
at bootstrapNodeJSCore (internal/bootstrap/node.js:743:3)
I have tried everything I could found.
I tried to manually install devkit with the command npm install --save-dev #angular-devkit/build-angular
I tried to run the command npm i --only=dev
I tried to run the commands
:
npm install
ng update
npm update
Removed the node_modules folder and the package-lock.json file and ran the commands all again.
Nothing worked. Running ng v gives me this:
Angular CLI: 8.0.3
Node: 10.15.0
OS: win32 x64
Angular: 8.0.1
... animations, cdk, common, compiler, compiler-cli, core, forms
... language-service, platform-browser, platform-browser-dynamic
... router
Package Version
-----------------------------------------------------------
#angular-devkit/architect 0.13.9
#angular-devkit/build-angular 0.13.9
#angular-devkit/build-optimizer 0.13.9
#angular-devkit/build-webpack 0.13.9
#angular-devkit/core 7.3.9
#angular-devkit/schematics 8.0.3
#angular/cli 8.0.3
#ngtools/webpack 7.3.9
#schematics/angular 8.0.3
#schematics/update 0.800.3
rxjs 6.5.2
typescript 3.4.5
webpack 4.29.0
And my package.json is like this:
{
"name": "financial-app-ui",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"#angular/animations": "^8.0.1",
"#angular/cdk": "^8.0.1",
"#angular/common": "^8.0.1",
"#angular/compiler": "^8.0.1",
"#angular/core": "^8.0.1",
"#angular/forms": "^8.0.1",
"#angular/platform-browser": "^8.0.1",
"#angular/platform-browser-dynamic": "^8.0.1",
"#angular/router": "^8.0.1",
"core-js": "^2.6.9",
"font-awesome": "^4.7.0",
"primeicons": "^1.0.0",
"primeng": "^7.1.3",
"rxjs": "~6.5.2",
"tslib": "^1.10.0",
"zone.js": "~0.9.1"
},
"devDependencies": {
"#angular-devkit/build-angular": "^0.13.9",
"#angular/cli": "^8.0.3",
"#angular/compiler-cli": "^8.0.1",
"#angular/language-service": "^8.0.1",
"#types/jasmine": "~2.8.8",
"#types/jasminewd2": "~2.0.3",
"#types/node": "~8.9.4",
"codelyzer": "~4.5.0",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~4.0.0",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.4.0",
"ts-node": "~7.0.0",
"tslint": "~5.11.0",
"typescript": "~3.4.5"
}
}
Does anyone have any other suggestion?
I got this working by reinstalling the build-angular package. Note the '--save-dev' flag on the install command:
npm uninstall #angular-devkit/build-angular
npm install --save-dev #angular-devkit/build-angular
Resolved my issue by using the below command:
ng update #angular/cli #angular/core --allow-dirty --force
I had the same problem. Just two command solved my problem
npm uninstall #angular-devkit/build-angular
npm install --save-dev #angular-devkit/build-angular
//OR
npm install #angular-devkit/build-angular
If this doesn't work. don't worry. run this command.
ng update #angular/cli #angular/core --allow-dirty --force
I was able to solve this problem by installing the package #angular-devkit/build-angular using this command:
npm install #angular-devkit/build-angular --force
ng update should have updated the version for your #angular-devkit/build-angular
I ran into this as well and what I did was created a new Angular app and ensured that ng serve was working fine for that newly created Angular app. I then copied and used the following from the working Angular app's package.json, which is:
`"#angular-devkit/build-angular": "~0.802.2",`
Ensure you run npm install
(The version would most probably change with each Angular update - so check what version you need to use by following the steps I have outlined - if ng update doesn't already update it for you)
Make sure you have this configuration in your angular.json
"serve": {
"builder": "#angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "angular8:build"
},
"configurations": {
"production": {
"browserTarget": "angular8:build:production"
}
}
}
And make sure you have installed this package
#angular-devkit/build-angular
I'm having the same issue, but in my case I am trying to serve a downloaded template of an Angular project. At first it gave me this error after a ng serve --open terminal command.
An unhandled exception occurred:
Could not find module "#angular-devkit/build-angular" from "D:\WORK\Desarrollo\plantillas descargadas\argon-dashboard-angular-master".
I solved that following this Stack Overflow question: https://stackoverflow.com/a/50333128,
but got these warnings:
npm notice created a lockfile as package-lock.json. You should commit this file.
npm WARN #ngtools/webpack#7.3.1 requires a peer of #angular/compiler-cli#>=5.0.0
<8.0.0 || ^7.0.0-beta.0 but none is installed. You must install peer dependencies
yourself.
npm WARN ajv-keywords#3.4.1 requires a peer of ajv#^6.9.1 but none is installed. You
must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.2.9
(node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for
fsevents#1.2.9: wanted {"os":"darwin","arch":"any"} (current:
{"os":"win32","arch":"x64"})
But then I got this error after trying the command:
ng serve --open
An unhandled exception occurred: Could not find the implementation for builder
#angular-devkit/build-angular:dev-server
I noticed that there were some files missing in my node_modules folder, probably caused by my current connection speed. Anyway I tried on a different computer, somewhere else, opened a clone of the project itself and ran the command:
npm update
then take the project in a .rar file to my working computer and decompressed it, run my VS Code and it just worked perfectly.
In angular.json change this line "builder": "#angular-builders/build-angular:browser", to "builder": "#angular-devkit/build-angular:browser", solved my problem.
Since you got this error, you might be using an app which uses old version of angular dev such as 0.6.x
If you simply uninstall and reinstall , it's very likely that you got other errors like "cannot find module '#angular/compiler-cli/src/tooling'" or Cannot find module '#angular/compiler-cli/ngcc' because it seems that angular has been making a lot changes.
If you solved the problem simply by updating , then forget about the following.
It's best to use the next version(relative to 0.6.5) that doesn't cause the build error and ngcc error.
In my case, the correct version is between the build error and ngcc error.
This worked for me.
First run update command ie. ng update
On running this you may get a list of other packages that should also be updated.
Install these packages manually as suggested.
After this on running ng serve I got error in angular.json for missing tsconfig.app.json file. These I added manually from this link . I also added tsconfig.spec.json file.
That is it, I ran ng serve again and the project complied successfully.
If you have npm 7+ installed in your machine try this command in terminal:
npm install --legacy-peer-deps instead of npm install and then run ng serve.
I faced this same issue while running the projects build on older version but none of the solution above could help me. Finally, I found the solution and I am sharing it with you.
Double Check Versions:
I looked at package.json & checked the all versions of all the Angular/Webkit programs, removing the ones giving me errors Typescript errors such as rxjs and googlemaps.
Remove the package-lock.json. Add all the correct versions of Angular, Webkit, Typescript, etc... checking to see what past versions render. This means looking through the Version history for packages on npmjs.com and matching by date / age and version numbers. Make the changes in package.json and save it.
"dependencies" {
"#agm/core": "1.0.0",
"#angular/cdk": "6.1.0",
"rxjs": "6.0.0",
"rxjs-compat": "6.0.0",
...
},
...
"devDependencies": {
"#angular-devkit/build-angular": "0.6.1", // old: "^6.1.0",
"#angular/cli": "6.1.0", // new: "6.1.0",
"#angular/compiler-cli": "6.1.0",
"typescript": "2.7.2"
...
}
Start fresh by removing all the old modules:
rm -fR ./node_modules/#angular; rm -fR ./node_modules/#angular-devkit/; rm -fR ./node_modules/typescript; rm -fR ./node_modules/rxjs*; rm package-lock.json;
Then re-install:
npm install;
.Pug Template Fix: I'm using a .pug loader so I had to manually patch: node_modules/#angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/common.js to allow Webpack to render Pug files. Add this line after the html rule inside that file:
{ test: /.pug$/, use: [ { loader: "apply-loader" }, { loader: "pug-loader" } ] },.
This is imitating what the ng-add-pug-loader.js file is doing to load .pug files in Angular version 6.
I'm currently trying to implement this tutorial:
https://www.typescriptlang.org/docs/handbook/react-&-webpack.html
I'm supposed to install react and react-dom and also webpack + typescript + awesome-typescript-loader + source-map-loader, and that's what I did. I also installed webpack-cli accordingly to instructions that I got from the command line.
I installed all of them locally (the react and react-dom as PROD and the rest as DEV dependencies).Currently I don't have any packages installed globally.
After this, that's my package.json file:
{
"name": "reactandwebpack-tutorial",
"version": "1.0.0",
"description": "",
"main": "webpack.config.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"author": "",
"license": "ISC",
"devDependencies": {
"awesome-typescript-loader": "^5.2.0",
"source-map-loader": "^0.2.3",
"typescript": "^2.7.2",
"webpack": "^4.16.4",
"webpack-cli": "^3.1.0"
},
"dependencies": {
"#types/react": "^16.4.7",
"#types/react-dom": "^16.0.6",
"react": "^16.4.2",
"react-dom": "^16.4.2"
}
}
At this point, when I run npm ls I get a bunch of errors, because of some optional dependency of webpack that apparently is missing (all the errors in the tree are inside webpack and below fsevents as following):
webpack#4.16.4
(...)watchpack#1.6.0
(...)chokidar#2.0.4
(...)fsevents#1.2.4 -> UNMET OPTIONAL DEPENDENCY
And everything below fsevents is also marked with UNMET DEPENDENCY
And when I run webpack command, I get a "webpack not recognized error".
Anyone can help? I've been trying to wrap my head around this for a while.
PS:
Npm -v 5.6.0
Node -v 8.11.3 //(that's what I get from the terminal,
//VSCode "About" tells me something different, I don't know why).
Using Visual Code
Version 1.24.0
Date 2018-06-06T17:35:40.560Z
Shell 1.7.12
Renderer 58.0.3029.110
Node 7.9.0
Architecture x64
The reason is because it was not linked to your env. When you install something globally, you have access to it everywhere, hence it works just by doing webpack. Since you installed everything locally, the binaries are located inside node_modules/.bin.
You have two options when you install something locallly.
Use npm scripts (npm run build, watch... whatever).
./node_modules/.bin/moduleName --flags
It is easier to create a npm script and add all the commands there.
SOLVED
Not sure the reason but it had something to do with the ./bin folder with the webpack-cli "ambient variable" not being available (I don't know it that would be the most accurate description).
When I try to run webpack, I get "not recognized error".
But when I run nodemodules\.bin\webpack-cli it works normally.
Everything is installed locally.
I can also run it with options, like nodemodules\.bin\webpack-cli --help
If you run "webpack", The CLI will find global webpack with is installed by (npm install webpack -g). To use webpack from local project. you should it to npm script.
package.json
{
"script": {
"start": "webpack"
}
}
By doing this, you can run npm start to run webpack.
Following warning is being thrown on npm install command -
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#1.1.2 (node_modules\rea
ct-scripts\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#
1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}
)
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents#^1.0.0 (node_modules\ch
okidar\node_modules\fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents#
1.1.2: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"}
)
The warning is apparently causing our Jenkins Job to mark failed, so we are just trying to get rid of the same.
I already checked this https://stackoverflow.com/a/42938398/351903
But, unlike what is mentioned there, I do not have any /node_modules/fserrors in my setup. Also, my package.json does not contain fserrors. Following is my package.json -
{
"name": "mvc-panel",
"version": "0.1.0",
"private": true,
"dependencies": {
"bootstrap": "^3.3.7",
"jquery": "^3.2.1",
"material-ui": "^0.18.3",
"qs": "^6.4.0",
"react": "^15.5.4",
"react-alert": "^2.1.2",
"react-bootstrap-table": "^3.4.1",
"react-dom": "^15.5.4",
"react-loader": "^2.4.2",
"react-router-dom": "^4.1.1",
"react-tap-event-plugin": "^2.0.1",
"serve": "^6.0.0"
},
"devDependencies": {
"datatables.net": "^1.10.15",
"jquery": "^3.2.1",
"react-scripts": "^1.0.7"
},
"scripts": {
"start": "react-scripts start",
"build": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject"
}
}
I can see fsevents in the package.json of react-scripts (which is defined under devDependencies of my package.json) in node_modules\react-scripts\package.json -
{
"_args": [
[
{
"raw": "react-scripts#^1.0.7",
"scope": null,
"escapedName": "react-scripts",
"name": "react-scripts",
"rawSpec": "^1.0.7",
"spec": ">=1.0.7 <2.0.0",
"type": "range"
},
"D:\\Sandeepan\\Payu MVC\\backend codebase\\MVC2.0\\panel\\mvc-panel"
]
],
"_from": "react-scripts#>=1.0.7 <2.0.0",
"_id": "react-scripts#1.0.14",
"_inCache": true,
"_location": "/react-scripts",
"_nodeVersion": "8.5.0",
"_npmOperationalInternal": {
"host": "s3://npm-registry-packages",
"tmp": "tmp/react-scripts-1.0.14.tgz_1506471610836_0.5613740666303784"
},
"_npmUser": {
"name": "timer",
"email": "timer150#gmail.com"
},
"_npmVersion": "5.3.0",
"_phantomChildren": {
"asap": "2.0.6",
"escape-string-regexp": "1.0.5",
"graceful-fs": "4.1.11",
"has-ansi": "2.0.0",
"universalify": "0.1.1"
},
"_requested": {
"raw": "react-scripts#^1.0.7",
"scope": null,
"escapedName": "react-scripts",
"name": "react-scripts",
"rawSpec": "^1.0.7",
"spec": ">=1.0.7 <2.0.0",
"type": "range"
},
"_requiredBy": [
"#DEV:/"
],
"_resolved": "https://registry.npmjs.org/react-scripts/-/react-scripts-1.0.14.tgz",
"_shasum": "70fe76c9beb67b136b953e875bdfe4ad78d410d1",
"_shrinkwrap": null,
"_spec": "react-scripts#^1.0.7",
"_where": "D:\\Sandeepan\\Payu MVC\\backend codebase\\MVC2.0\\panel\\mvc-panel",
"bin": {
"react-scripts": "./bin/react-scripts.js"
},
"bugs": {
"url": "https://github.com/facebookincubator/create-react-app/issues"
},
"dependencies": {
"autoprefixer": "7.1.2",
"babel-core": "6.25.0",
"babel-eslint": "7.2.3",
"babel-jest": "20.0.3",
"babel-loader": "7.1.1",
"babel-preset-react-app": "^3.0.3",
"babel-runtime": "6.26.0",
"case-sensitive-paths-webpack-plugin": "2.1.1",
"chalk": "1.1.3",
"css-loader": "0.28.4",
"dotenv": "4.0.0",
"eslint": "4.4.1",
"eslint-config-react-app": "^2.0.1",
"eslint-loader": "1.9.0",
"eslint-plugin-flowtype": "2.35.0",
"eslint-plugin-import": "2.7.0",
"eslint-plugin-jsx-a11y": "5.1.1",
"eslint-plugin-react": "7.1.0",
"extract-text-webpack-plugin": "3.0.0",
"file-loader": "0.11.2",
"fs-extra": "3.0.1",
"fsevents": "1.1.2",
"html-webpack-plugin": "2.29.0",
"jest": "20.0.4",
"object-assign": "4.1.1",
"postcss-flexbugs-fixes": "3.2.0",
"postcss-loader": "2.0.6",
"promise": "8.0.1",
"react-dev-utils": "^4.1.0",
"style-loader": "0.18.2",
"sw-precache-webpack-plugin": "0.11.4",
"url-loader": "0.5.9",
"webpack": "3.5.1",
"webpack-dev-server": "2.8.2",
"webpack-manifest-plugin": "1.2.1",
"whatwg-fetch": "2.0.3"
},
"description": "Configuration and scripts for Create React App.",
"devDependencies": {
"react": "^15.5.4",
"react-dom": "^15.5.4"
},
"directories": {},
"dist": {
"integrity": "sha512-+p0q2N2WW7L4WW6uObqN7fYwSQZ9fBI0StpMYl1Ukoz/lCbemf+yW6b8refyhTsGy62GAqxlpyEfVcTE3hJAxg==",
"shasum": "70fe76c9beb67b136b953e875bdfe4ad78d410d1",
"tarball": "https://registry.npmjs.org/react-scripts/-/react-scripts-1.0.14.tgz"
},
"engines": {
"node": ">=6"
},
"files": [
"bin",
"config",
"scripts",
"template",
"utils"
],
"homepage": "https://github.com/facebookincubator/create-react-app#readme",
"license": "MIT",
"maintainers": [
{
"name": "timer",
"email": "timer150#gmail.com"
},
{
"name": "fb",
"email": "opensource+npm#fb.com"
},
{
"name": "gaearon",
"email": "dan.abramov#gmail.com"
}
],
"name": "react-scripts",
"optionalDependencies": {
"fsevents": "1.1.2"
},
"readme": "ERROR: No README data found!",
"repository": {
"type": "git",
"url": "git+https://github.com/facebookincubator/create-react-app.git"
},
"version": "1.0.14"
}
Update
I tried running the npm install command and getting the exit status of the earlier command. It showed 0 meaning success, despite the warnings. So, it does not look like Jenkins job should be stuck due to this. However, we are still trying to find a way to get rid of this warning because it is not relevant to our OS.
fsevents is dealt differently in mac and other linux system. Linux system ignores fsevents whereas mac install it. As the above error message states that fsevents is optional and it is skipped in installation process.
You can run npm install --no-optional command in linux system to avoid above warning.
Further information
https://github.com/npm/npm/issues/14185
https://github.com/npm/npm/issues/5095
If you want to hide this warn, you just need to install fsevents as a optional dependency.
Just execute:
npm i fsevents#latest -f --save-optional
..And the warn will no longer be a bother.
npm i -f
I'd like to repost some comments from this thread, where you can read up on the issue and the issue was solved.
This is exactly Angular's issue. Current package.json requires fsevent
as not optionalDependencies but devDependencies. This may be a problem
for non-OSX users.
Sometimes
Even if you remove it from package.json npm i still fails because
another module has it as a peer dep.
So
if npm-shrinkwrap.json is still there, please remove it or try npm i
-f
package.json counts with a optionalDependencies key.
NPM on Optional Dependencies.
You can add fsevents to this object and if you find yourself installing packages in a different platform than MacOS, fsevents will be skipped by either yarn or npm.
"optionalDependencies": {
"fsevents": "2.1.2"
},
You will find a message like the following in the installation log:
info fsevents#1.2.11: The platform "linux" is incompatible with this module.
info "fsevents#1.2.11" is an optional dependency and failed compatibility check. Excluding it from installation.
info fsevents#2.1.2: The platform "linux" is incompatible with this module.
info "fsevents#2.1.2" is an optional dependency and failed compatibility check. Excluding it from installation.
Hope it helps!
I found the same problem and i tried all the solution mentioned above and in github. Some works only in local repository, when i push my PR in remote repositories with travic-CI or Pipelines give me the same error back. Finally i fixed it by using the npm command below.
npm audit fix --force
This no longer happens with npm v7. You can update your npm version or update to node v15 or higher, which by default installs npm v7.
Follow these steps -
Go to the project's "package.lock.json" file
Press "Ctrl+F" (to enable search)
Type "darwin"
Rename it to 'linux'
I also had the same issue though am using MacOS. The issue is kind of bug. I solved this issue by repeatedly running the commands,
sudo npm cache clean --force
sudo npm uninstall
sudo npm install
One time it did not work but when I repeatedly cleaned the cache and after uninstalling npm, reinstalling npm, the error went off. I am using Angular 8 and this issue is common
Instead of using --no-optional every single time, we can just add it to npm or yarn config.
For Yarn, there is a default no-optional config, so we can just edit that:
yarn config set ignore-optional true
For npm, there is no default config set, so we can create one:
npm config set ignore-optional true
Do this:
npm install --no-optional
For more info on this go through: https://github.com/npm/npm/issues/11632
I'm using,
Angular CLI: 8.1.2
Node: 12.14.1
OS: win32 x64
Strangely, this helped me
npm cache clean --force
npm uninstall #angular/cli
npm install #angular/cli#8.1.2
For anyone reading it recently, the simplest thing to do on Ubuntu is to install the latest LTS versions of nvm, node.js, and nmp. from version 7 of node.js, these issues have been sorted out.
Refer to this guide:
https://computingforgeeks.com/how-to-install-node-js-on-ubuntu-debian/
I solved this by deleting the node_modules folder and running npm i.
I got the same error. In my case, I was using a mapped drive to edit code off of a second computer, that computer was running linux. Not sure exactly why gulp-watch relies on operating system compatibility prior to install (I would assume it has to do with security purposes). Essentially the error is checking against your operating system and the operating system calling the node module, in my case the two operating systems were not the same so it threw it error. Which from the looks of your error is the same as mine.
The Error
Unsupported platform for fsevents#1.1.3: wanted {"os":"darwin","arch":"any"} (current: {"os":"win32","arch":"x64"})
How I fixed it?
I logged into the linux computer directly and ran
npm install --save-dev <module-name>
Then went back into my coding environment and everything was fine after that.
Hope that helps!
run
npm install -D vue-loader vue-template-compiler
Vue CLI
If you are not interested in manually setting up webpack, it is recommended to scaffold a project with Vue CLI instead. Projects created by Vue CLI are pre-configured with most of the common development needs working out of the box.
Follow this guide if the built-in configuration of Vue CLI does not suit your needs, or you'd rather create your own webpack config from scratch.
#Manual Setup
#Installation
Unless you are an advanced user using your own forked version of Vue's template compiler, you should install vue-loader and vue-template-compiler together:
Check your node version and check if the package.json was generate using a different version of node.
I downloaded a repo created from Mac from a Linux and faced this error when trying to npm install. I was using node v14.15.0 and when I switched to v16.13.0, the error disappeared.
Yes, it works when with the command npm install --no-optional
Using environment:
iTerm2
macos login to my vm ubuntu16 LTS.
I had got this error, Linux system(Ubuntu) and This might happen when you run :
npm install
1) If the project is not present in your localdisk/computer, copy it to your computer and try again. So you get the permission to access folder (Just make sure you have access permission).
2) If you still get some warnings or errors, run:
npm audit fix
This will solve vulnerabilities in your dependencies and can help you fix a vulnerability by providing simple-to-run npm commands and recommendations for further troubleshooting.
Hope it helps!
Switch to PNPM: https://pnpm.js.org/
The fsevents warnings are gone (on Linux).
Even the latest yarn (2.x) shows the warnings.
If anyone get this error for ionic cordova install . just use this code npm install --no-optional in your cmd.
And then run this code npm install -g ionic#latest cordova
Use sudo npm install -g appium.
I have a repository containing a package.json which contains scoped dependencies. I also have an .npmignore file intended to whitelist all files and subdirectories in dist/. The problem is all of the scoped dependencies are included when running npm install #private/a another repository. This includes both private npm packages and public packages such as #uirouter.
package.json:
{
"name": "#private/a",
"version": "1.0.0",
"description": "",
"main": "dist/index.js",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"repository": {
"type": "git",
"url": "git+ssh://git#bitbucket.org/private/a.git"
},
"author": "",
"license": "ISC",
"homepage": "https://bitbucket.org/private/a#readme",
"devDependencies": {
"gulp": "^3.9.1",
"gulp-angular-embed-templates": "^2.3.0",
"gulp-concat": "^2.6.1",
"gulp-jshint": "^2.0.4",
"gulp-rename": "^1.2.2",
"gulp-sass": "^3.0.0",
"gulp-uglify": "^2.0.0",
"jshint": "^2.9.4"
},
"dependencies": {
"#private/b": "^1.0.0",
"#private/c": "^1.0.0"
}
}
.npmignore
**
!dist/**
Despite these two files when I run npm install #private/a --save within another repository it is installing the dependency along with all it's scoped dependencies:
/node_modules/#private/a/dist/index.js
/node_modules/dist/css/styles.css
/node_modules/#private/a/node_modules/#private/b
/node_modules/#private/a/node_modules/#private/c
package.json
It should only be this:
/node_modules/#private/a/dist/index.js
/node_modules/dist/css/styles.css
package.json
How can I achieve this? I have tried different variations of the .npmignore but have not had any luck.
.npmignore is irrelevant to what you are trying to do. This file only decides which parts of your npm package code ends up in npm registry. So it is working as advertised.
Your problem must be in your npmconfig or because of using an older version of npm. The latest version installs stuff as so:
/node_modules/#private/a/dist/index.js
/node_modules/#private/b/...
/node_modules/#private/c/...
package.json
I have verified that this is happening with latest npm. But there used to be a time when npm installed dependencies into a nested structure. See this for example. So I suggest:
Making sure you have latest node and npm.
Making sure your npm config is not forcing legacy bundling. Run npm get legacy-bundling. Make sure this is false.
There are few cases where the nesting of dependencies happens legitimately even with the latest npm. See this. But I am guessing your problem is not due to this. You can test by simply doing npm install #private/a in an empty folder.
Node will install your package files along with all the dependencies declared under dependencies field.
How the dependencies tree is build, depends on which version of npm do you use.
If your package doesn't need those dependencies to run, it means they are just dev dependencies and you can safely list them under devDependencies field.
Dev dependencies are only installed when you run an npm install inside the plugin directory.
You need to lock your dependency. You might want to check out npm shrinkwrap.
I have a dependency that is only needed for Mac OS in an npm project and was wondering if there is some way to conditionally include this dependency only when the compatible platform is the one running npm install.
I'm willing to write the logic for this. In the below case grunt-appdmg is causing the npm install process to error out (for fairly obvious reasons) with:
'/dev/cuttle/node_modules/grunt-appdmg/node_modules/appdmg/node_modules/ds-store/node_modules/macos-alias/build'
CXX(target) Release/obj.target/volume/src/volume.o
../src/volume.cc:9:2: error: #error This platform is not implemented yet
#error This platform is not implemented yet
package.json
{
"name": "Cuttle",
"homepage": "https://github.com/oakmac/cuttle",
"license": "MIT",
"repository": {
"type": "git",
"url": "https://github.com/oakmac/cuttle.git"
},
"dependencies": {
"fs-extra": "0.16.3",
"open": "0.0.5",
"winston": "0.8.3"
},
"devDependencies": {
"grunt": "0.4.5",
"grunt-contrib-less": "0.11.4",
"grunt-contrib-watch": "0.6.1",
"grunt-curl": "2.0.3",
"grunt-download-atom-shell": "0.10.0",
"grunt-appdmg": "0.2.0",
"winresourcer": "0.9.0",
"moment": "2.9.0",
"shelljs": "0.3.0"
}
}
You can use an optional dependency.
Like this in your package.json:
"optionalDependencies":{
"grunt-appdmg":"0.2.0"
}
More info on NPM documentation
npm install will then just skip it if it fails.
Let me introduce handpick that lets you target and filter multiple dependencies. I wrote this to speed up CI stages that just need a fragment of the devDependencies but there are eventually more usecases. This project is quite experimental - please leave some feedback.
Installation
Install on your system:
npm install handpick --global
Usage
Run the command:
handpick [options]
-V, --version
-T, --target
-F, --filter
-M, --manager
-P, --path
-h, --help
Examples
Define unofficial dependencies inside package.json file:
{
"lintDependencies":
{
"eslint": "6.8.0",
"eslint-config-redaxmedia": "2.0.0"
},
"testDependencies":
{
"chai": "4.2.0",
"mocha": "7.1.1"
}
}
Install the lintDependencies:
handpick --target=lintDependencies
Install the devDependencies and lintDependencies via YARN:
handpick --target=devDependencies --target=lintDependencies --manager=yarn
Install the devDependencies without testDependencies:
handpick --target=devDependencies --filter=testDependencies
Install the dependencies and devDependencies within path:
handpick --path=../shared