Angular-cli: Problem with ng serve --preserve-symlinks Angular/CLI 6.0.0

[edtivic]

Versions

Angular CLI: 6.0.0
Node: 8.11.1
OS: Windows 10 x64
Angular: 6.0.0

"@angular/animations": "6.0.0",
"@angular/cdk": "^6.0.1",
"@angular/cli": "^6.0.0",
"@angular/common": "6.0.0",
"@angular/compiler": "6.0.0",
"@angular/core": "6.0.0",
"@angular/flex-layout": "6.0.0-beta.15",
"@angular/forms": "6.0.0",
"@angular/http": "6.0.0",
"@angular/material": "^6.0.1",
"@angular/material-moment-adapter": "^6.0.0",
"@angular/platform-browser": "6.0.0",
"@angular/platform-browser-dynamic": "6.0.0",
"@angular/router": "6.0.0",
"@angular/service-worker": "6.0.0",

Repro steps

execute "ng serve --preserve-symlinks"

Observed behavior

Return error "Unknown option: '--preserveSymlinks'", was removed?

Desired behavior

Angular compile with symbolic link folders

Mention any other details that might be useful (optional)

[gillerr]

Seems that compile options have been removed. This post leads me to the solution: https://stackoverflow.com/questions/50177552/angular-cli-6-unknown-option-locale

I solved this by adding "preserveSymlinks": true in my angular.json file:

{ 
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
        "my-project": {
            "root": "",
            "sourceRoot": "src",
            "projectType": "application",
            "architect": {
                "build": {
                    "builder": "@angular-devkit/build-angular:browser",
                    "options": {
                       "outputPath": "target",
                       "index": "src/index.html",
                       "main": "src/main.ts",
                       "tsConfig": "src/tsconfig.app.json",
                       "polyfills": "src/showcase/polyfills.ts",
                       "preserveSymlinks": true,
...

[edtivic]

@gillerr my hero, works now! Thanks!!

[jgutix]

@gillerr however that option seems to apply only to build, if I add that option to the serve bracket, I get:

Schema validation failed with the following errors:
  Data path "" should NOT have additional properties(preserveSymlinks).

[brianpilati]

I do agree that having the option on both build and serve would be great. I usually run "symlinks" while I am serving and working on the code. However, when I build, I want it to be all installed npm libraries

[gillerr]

@jgutix, yes I noticed that too. But adding it to the build part also applies to the serve command.
I also agree with @brianpilati, it would indeed be great to have separate options for buildand serve.

[xino1010]

@gillerr thank you so much!

[Pilukina]

Hi! I use the follow configuration:

Angular CLI: 6.0.3
Node: 8.11.2
OS: win32 x64
Angular: 6.0.2
... animations, common, compiler, compiler-cli, core, forms
... http, language-service, platform-browser
... platform-browser-dynamic, router

Package Version

@angular-devkit/architect 0.6.3
@angular-devkit/build-angular 0.6.3
@angular-devkit/build-optimizer 0.6.3
@angular-devkit/core 0.6.3
@angular-devkit/schematics 0.6.3
@angular/cli 6.0.3
@ngtools/webpack 6.0.3
@schematics/angular 0.6.3
@schematics/update 0.6.3
rxjs 6.2.0
typescript 2.7.2
webpack 4.8.3

angular.json "architect": { "build": { "builder": "@angular-devkit/build-angular:browser", "options": { "preserveSymlinks": true,

And still when executing:
ng serve --preserveSymlinks or ng serve --preserve-symlinks
The terminal throw:
Unknown option: '--preserveSymlinks'

How could I use sym-links with this config?
Many Thanks

[edtivic]

@Pilukina try it without "--preserve-symlinks" on ng serve, the param works only in angular.json.

[Twois]

I got this error message:

_ERROR in ./node_modules/corepackage/index.ts
Module build failed: Error: C:theprojectnode_modulescorepackageindex.ts is missing from the TypeScript compilation. Please make sure it is in your tsconfig via the 'files' or 'include' property._

angular.json
"projectType": "application",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/browser",
"index": "src/index.html",
"main": "src/main.ts",
"tsConfig": "src/tsconfig.app.json",
"polyfills": "src/polyfills.ts",
"preserveSymlinks": true,

Script to start:
ng serve --port 6300 --host 0.0.0.0 --disable-host-check --aot=false --hmr=true

Packages:
"dependencies": {
"@angular/animations": "^6.0.0",
"@angular/cdk": "^6.0.2",
"@angular/common": "^6.0.0",
"@angular/compiler": "^6.0.0",
"@angular/core": "^6.0.0",
"@angular/flex-layout": "^6.0.0-beta.15",
"@angular/forms": "^6.0.0",
"@angular/http": "^6.0.0",
"@angular/platform-browser": "^6.0.0",
"@angular/platform-browser-dynamic": "^6.0.0",
"@angular/router": "^6.0.0",
"@angular/upgrade": "^6.0.0",
"@nguniversal/express-engine": "^6.0.0",
"@nguniversal/module-map-ngfactory-loader": "^6.0.0",
"angular-in-memory-web-api": "^0.6.0",
"core-js": "^2.5.4",
"rxjs": "^6.0.0",
"uuid": "^3.2.1",
"zone.js": "^0.8.24"
},
"devDependencies": {
"@angular/compiler-cli": "^6.0.0",
"@angular-devkit/build-ng-packagr": "~0.6.1",
"@angular-devkit/build-angular": "~0.6.0",
"ng-packagr": "^3.0.0-rc.2",
"tsickle": ">=0.25.5",
"tslib": "^1.7.1",
"typescript": "2.7.2",
"@angular/cli": "^6.0.0",
"@angular/platform-server": "^6.0.0",
"@types/jasmine": "~2.8.0",
"@types/jasminewd2": "^2.0.3",
"@types/node": "^6.0.45",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~1.4.2",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"karma-phantomjs-launcher": "^1.0.2",
"lodash": "^4.16.2",
"phantomjs-prebuilt": "^2.1.7",
"protractor": "~5.3.0",
"ts-node": "^5.0.1",
"tslint": "^5.9.1",
"ts-loader": "^4.2.0",
"webpack-cli": "^2.0.14"
},

[Pilukina]

@Twois Could you check in your corepackage if you have an index.ts file (which export the other .ts) on src folder? And the follow configuration on src/tsconfib.json:

{ "compileOnSave": false, "compilerOptions": { "outDir": "./dist/out-tsc", **"baseUrl": "./src",** "sourceMap": true, "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es5", "typeRoots": [ "node_modules/@types" ], "lib": [ "es2016", "dom" ] }, **"files":** [ "./index.ts", ], }

[nitigyan]

@gillerr I am still getting the same error after adding preserveSymlinks option in angular.json. I had to solve it by adding this to tsconfig.json

"include": [
    "./src/main.ts",
    "./src/polyfills.ts"
  ]

[gillerr]

@nitigyan, this should have been added automatically with ng update

[tabareh]

@Twois make sure you have included and excluded the right files in tsconfig.app.json

"exclude": [
    "src/test.ts",
    "**/*.spec.ts",
    "../node_modules/core/src/**/*.spec.ts"
  ],
  "include": [
    "./**/*.ts",
    "../node_modules/core/src/**/*.ts"
  ]

[ramification]

I had some troubles with a similar case:

import { ClassName } from "packageName/src/models/modelName";

The package is a private one, retrieved from bitbucket.

And since I've updated my project from angular 4x to 6x i've the error:

"**.ts is missing from the typescript compilation [...] .ts files in a library is a sign of a badly packaged library [...]"

I've referenced the files with:

include: [ "./src/**/*.ts", "./node_modules/packageName/src/**/*.ts" ]

I don't know if this is the best solution but I can now "ng serve" without errors.

[marlongehringer]

It's not possible to add preserved symlinks to the build options in the angular.json when using library as projectType.

If you want to build a library with preserved symlinks you need to add
"preserveSymlinks": true to the angularCompilerOptions in tsconfig.lib.json.

e.g.

tsconfig.lib.json

"angularCompilerOptions": {
    "annotateForClosureCompiler": true,
    "skipTemplateCodegen": true,
    "strictMetadataEmit": true,
    "fullTemplateTypeCheck": true,
    "strictInjectionParameters": true,
    "enableResourceInlining": true,
    "preserveSymlinks": true
  },

[filipesilva]

Closing as the question has been answered.

For browser apps, add "preserveSymlinks": true, as @gillerr mentioned in https://github.com/angular/angular-cli/issues/10735#issuecomment-387636803. This also automatically applies to serving since serving uses build.

For libraries follow the instructions by @marlongehringer in https://github.com/angular/angular-cli/issues/10735#issuecomment-425136421. Libraries use a different build system and thus have different options. To learn more about packaging libraries and the options available, please see https://github.com/ng-packagr/ng-packagr.

[alfonsobravi]

@filipesilva Isn't it worth promoting the highlighted solutions to some degree of documentation? While the angular.json schema is probably a good enough hint to the solution for browser apps, the library solution is not entirely straightforward. That would save people a lot of debug time!

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{_This action has been performed automatically by a bot._}