filipesilva / angular-quickstart-lib

MIT License
305 stars 75 forks source link

The fixing way for running issue: 'npm start' this repo #77

Open HaolunWang opened 2 years ago

HaolunWang commented 2 years ago

I got to know how to fix the 'Invalid 'reference' directive syntax' issue after you cloned the repo, did 'npm install', and did 'npm start'.

The solution is to update the package.json, update the typescript version:

package.json: "devDependencies": { "typescript": "^4.6.3" }

So, update the typescript version to the latest one (the current latest version is 4.6.3).

LayZeeDK commented 2 years ago

TypeScript 4.6 is incompatible with older versions of Angular such as the one used in this repository. See https://gist.github.com/LayZeeDK/c822cc812f75bb07b7c55d07ba2719b3.

LayZeeDK commented 2 years ago

Also, only use this starter repo for Angular v4 or v5. Library projects have been built in to Angular CLI since version 6 if I recall correctly.

HaolunWang commented 2 years ago

Also, only use this starter repo for Angular v4 or v5. Library projects have been built in to Angular CLI since version 6 if I recall correctly.

But when you do "npm start" in this repo, it doesn't work for some reason. How to fix it? If you can't change the version of TypeScript in package.json

LayZeeDK commented 2 years ago

Use:

(I prefer Volta to manage Node.js versions)

Then modify package.json#devDependencies:

"@types/node": "~6.0.46",
"browser-sync": "~2.12.12",
"lite-server": "~2.2.2",

Finally:

npm install
npm start

Outcome: Your browser opens http://localhost:3000 and renders:

<demo-app ng-version="4.1.3">
  <my-lib _nghost-c0="">
    <h2 _ngcontent-c0="">Hello Angular Library</h2>
  </my-lib>
  <h3>Meaning is: 42</h3>
</demo-app>