I wanted to try out NX but i cannot build-run the angular app.
Commands i used:
npx create-nx-workspace --preset=angular-nest
after it was done I ran: nx serve
Following error output
> nx run angular-nest:serve:development
(node:16556) ExperimentalWarning: The ESM module loader is experimental.
✔ Browser application bundle generation complete.
<e> [webpack-dev-middleware] file:///D:/Source/bamma/node_modules/@angular/compiler-cli/bundles/chunk-EIFOOEXQ.js:12
<e> import { decode, encode } from "sourcemap-codec";
<e> ^^^^^^
<e> SyntaxError: The requested module 'sourcemap-codec' is expected to be of type CommonJS, which does not support named exports. CommonJS modules can be imported by importing the default export.
<e> For example:
<e> import pkg from 'sourcemap-codec';
<e> const { decode, encode } = pkg;
<e> at ModuleJob._instantiate (internal/modules/esm/module_job.js:97:21)
<e> at async ModuleJob.run (internal/modules/esm/module_job.js:136:20)
<e> at async Loader.import (internal/modules/esm/loader.js:179:24)
<e> at async AngularWebpackPlugin.initializeCompilerCli (D:\Source\bamma\node_modules\@ngtools\webpack\src\ivy\plugin.js:533:35)
I am wondering if it has something to do with some bad version matching between nx and angular, but since i have never used NX before i am not sure what to look for.
package.json
"dependencies": {
"@angular/animations": "~13.3.0",
"@angular/common": "~13.3.0",
"@angular/compiler": "~13.3.0",
"@angular/core": "~13.3.0",
"@angular/forms": "~13.3.0",
"@angular/platform-browser": "~13.3.0",
"@angular/platform-browser-dynamic": "~13.3.0",
"@angular/router": "~13.3.0",
"@nestjs/common": "^8.0.0",
"@nestjs/core": "^8.0.0",
"@nestjs/platform-express": "^8.0.0",
"@nrwl/angular": "14.0.5",
"reflect-metadata": "^0.1.13",
"rxjs": "~7.4.0",
"tslib": "^2.0.0",
"zone.js": "~0.11.4"
},
"devDependencies": {
"@angular-devkit/build-angular": "~13.3.0",
"@angular-eslint/eslint-plugin": "~13.1.0",
"@angular-eslint/eslint-plugin-template": "~13.1.0",
"@angular-eslint/template-parser": "~13.1.0",
"@angular/cli": "~13.3.0",
"@angular/compiler-cli": "~13.3.0",
"@angular/language-service": "~13.3.0",
"@nestjs/schematics": "^8.0.0",
"@nestjs/testing": "^8.0.0",
"@nrwl/cli": "14.0.5",
"@nrwl/cypress": "14.0.5",
"@nrwl/eslint-plugin-nx": "14.0.5",
"@nrwl/jest": "14.0.5",
"@nrwl/linter": "14.0.5",
"@nrwl/nest": "14.0.5",
"@nrwl/node": "14.0.5",
"@nrwl/workspace": "14.0.5",
"@types/jest": "27.4.1",
"@types/node": "16.11.7",
"@typescript-eslint/eslint-plugin": "~5.18.0",
"@typescript-eslint/parser": "~5.18.0",
"cypress": "^9.1.0",
"eslint": "~8.12.0",
"eslint-config-prettier": "8.1.0",
"eslint-plugin-cypress": "^2.10.3",
"jest": "27.5.1",
"jest-preset-angular": "11.1.1",
"nx": "14.0.5",
"prettier": "^2.5.1",
"ts-jest": "27.1.4",
"ts-node": "9.1.1",
"typescript": "~4.6.2"
}
I can run the Nest project just fine. Its only the angular app that seems to fail.
Edit:
I realized i have not updated my Node.JS in ages was running version 12.x.x
So i installed version 16.x.x and it works fine.