Search code examples
angularnpmangular-cliforkyarnpkg

Using forked Angular-CLI within an Angular 4 application with NPM


I have an application in which I'm attempting to use a forked version of Angular CLI 1.7.4 (https://github.com/angular/angular-cli/releases/tag/v1.7.4). I've forked and modified but I am now struggling to leverage this package in my Angular 4 application.

The problem is when installing the package using NPM, I receive the Yarn error Please use Yarn instead of NPM to install dependencies.. When I compare the raw tarballs from NPM (Original vs Forked) I notice many differences in available files and folders.

I realize I should have committed the initial rollback prior to updating the packages. This would have made the commits more valuable in the investigation. However, at this point I have to shift to another project and I won't be able to try that for a while.

Steps I followed to this point:

  1. Fork Angular-CLI via GitHub.
  2. Reset head to last 1.7.4 commit (git reset --hard 0b291ab).
  3. Update necessary packages in forked package using npm (less and node-sass).
  4. Run Yarn commands (yarn followed by yarn link) as detailed here: https://github.com/angular/angular-cli
  5. Publish to npm (npm publish).
  6. Install npm package into Angular 4 application (I've tried using NPM via npm install angularcli-patched-cryptiles and GitHub via npm install applegater/angular-cli as install sources, but each has the same result)

How do I publish my fork for use in an Angular 4 application using NPM? Should I have forgone the yarn commands?

Yarn error when running npm install:

PS C:\SourceCode\patchedapp> npm install applegater/angular-cli
npm WARN deprecated browserslist@2.11.3: Browserslist 2 could fail on reading Browserslist >3.0 config used in other tools.

> angularcli-patched-cryptiles@1.7.5 preinstall C:\SourceCode\patchedapp\node_modules\angularcli-patched-cryptiles
> node ./tools/yarn/check-yarn.js

C:\SourceCode\patchedapp\node_modules\angularcli-patched-cryptiles\tools\yarn\check-yarn.js:12
  throw new Error(
  ^

Error: Please use Yarn instead of NPM to install dependencies. See: https://yarnpkg.com/lang/en/docs/install/
    at Object.<anonymous> (C:\SourceCode\patchedapp\node_modules\angularcli-patched-cryptiles\tools\yarn\check-yarn.js:12:9)
    at Module._compile (internal/modules/cjs/loader.js:701:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:712:10)
    at Module.load (internal/modules/cjs/loader.js:600:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:539:12)
    at Function.Module._load (internal/modules/cjs/loader.js:531:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:754:12)
    at startup (internal/bootstrap/node.js:283:19)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:622:3)
npm WARN rollback Rolling back source-map@0.4.4 failed (this is probably harmless): EPERM: operation not permitted, scandir 'C:\SourceCode\patchedapp\node_modules\scss-tokenizer\node_modules'
npm WARN rollback Rolling back faye-websocket@0.11.1 failed (this is probably harmless): EPERM: operation not permitted, lstat 'C:\SourceCode\patchedapp\node_modules\sockjs-client\node_modules'npm WARN @ngrx/effects@2.0.2 requires a peer of @angular/core@^2.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN @ngrx/store@2.2.1 requires a peer of @angular/core@^2.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN codelyzer@2.1.1 requires a peer of tslint@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN ng2-charts@1.5.0 requires a peer of @angular/common@^2.3.0 but none is installed. You must install peer dependencies yourself.
npm WARN ng2-charts@1.5.0 requires a peer of @angular/core@^2.3.0 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"})

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! angularcli-patched-cryptiles@1.7.5 preinstall: `node ./tools/yarn/check-yarn.js`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the angularcli-patched-cryptiles@1.7.5 preinstall 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\<username>\AppData\Roaming\npm-cache\_logs\2019-05-17T12_27_02_933Z-debug.log

Diff between original (left) and forked (right) npm tarballs. enter image description here

Forked Repo: https://github.com/applegater/angular-cli

NPM: https://www.npmjs.com/package/angularcli-patched-cryptiles


Solution

  • I figured it out!  Angular CLI 7 changed from npm to yarn. In resolving conflicts with the initial rollback, git pulled in some additional yarn files from Angular CLI 7.  To work around this, I created a fresh repo (not based on a fork of cli) and committed the 1.7.4 version of cli there.  Now it installs!