-
Notifications
You must be signed in to change notification settings - Fork 26.2k
WIP - AIO: Third party library guide #16486
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
That will be really helpful for library authors 👍
the library they actually need and in the format they need it in. | ||
|
||
This cookbook shows how to publish a third party library in a way that makes it possible to | ||
fully benefit from techniques like Ahead of Time Compilation (AOT) and Tree Shaking. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Inconsistent capitalization AOT
(here) vs AOT
(above).
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
aio/content/guide/third-party-lib.md
Outdated
Third Party Library | ||
|
||
@intro | ||
Create a third party library with support for AoT, JiT and Tree Shaking. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I've noticed several variations throughout the text for terms like AOT
anf JIT
(e.g. "AoT" vs "AOT", "Ahead of Time" vs "Ahead-of-time" etc). I think we should be consistent.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
aio/content/guide/third-party-lib.md
Outdated
|
||
- `main` (default): an ES5 [UMD](https://github.com/umdjs/umd) bundle that can be consumed anywhere. | ||
- `module`: a flat ECMAScript Module (ESM) bundle containing ES5 code. | ||
- `es2015`: a flat ESM containing ES2015 bundle. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
bundle --> code (?)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
aio/content/guide/third-party-lib.md
Outdated
</div> | ||
|
||
<div class="l-sub-section"> | ||
A flat ECMAScript module (FESM) is a bundled ECMAScript module where all imports were followed |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
were followed copied onto the same file file --> ?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
## The QuickStart Library seed | ||
|
||
Setting up a new library project on your machine is quick and easy with the **QuickStart Library seed**, | ||
maintained [on github](https://github.com/angular/quickstart-lib "Install the github QuickStart Library repo"). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The link is invalid. Is the project supposed to be created later?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Correct, for now it is in https://github.com/filipesilva/angular-quickstart-lib. When this guide is approved we can move the codebase under the Angular org.
aio/content/guide/third-party-lib.md
Outdated
|
||
- Keep an eye on the issue tracker. | ||
- Document your library. | ||
- [Manage your dependencies properly](guide/appendix-dependency-management) |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Wrong link. It should be guide/third-party-lib#appendix-dependency-management
.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
aio/content/guide/third-party-lib.md
Outdated
|
||
Why not ship TypeScript source instead? | ||
After all the library will be part of another TypeScript compilation step when the library is | ||
imported by the consuming application? |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
? --> . (?)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
aio/content/guide/third-party-lib.md
Outdated
- `dependencies`: here go all the other libraries yours depends on when being used. | ||
A good way to figure out these is to go through your library source code (in `src/lib` **only**) | ||
and list all the libraries there. | ||
- `devDependencies`: libraries that you need while developing, testing and building your app |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
app --> library
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
aio/content/guide/third-party-lib.md
Outdated
go here. | ||
When a user installs your library, these won't be installed. | ||
Users don't need to develop, build or test your library, they just need to run it. | ||
your app. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Remove this line.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
aio/content/guide/third-party-lib.md
Outdated
A good rule of thumb is to have all `dependencies` specified with a tilde `~`(`~1.2.3`), | ||
while your `peerDependencies` have a range (`"@angular/core": ">=4.0.0 <5.0.0 || >=4.0.0-beta <5.0.0"`). | ||
|
||
Any extra dependency or peer Dependency that you add to `package.json` should also be added |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
peer Dependency --> peer dependency (?)
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Fixed
@filipesilva It would be nice to have a seed on github for this instead of text(or both). Thanks, It should help me to solve a problem. |
@FriOne the seed is temporarily at https://github.com/filipesilva/angular-quickstart-lib |
Thank you for the review @gkalpak, lots of improvements there. |
I'm looking forward to this being merged and the quickstart-lib codebase being added to @angular. |
|
||
Only code written in TypeScript can be AOT compiled. | ||
|
||
Before publishing the library must first be compiled using the AOT compiler (`ngc`). |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Add a comma after 'publishing', otherwise the sentence can be confusing the first time it is read.
JavaScript has no way of representing typings. | ||
In order to preserve the original typings, `ngc` will generate `.d.ts` typings files. | ||
|
||
*Meta Data JSON files* |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
All mentions of 'meta data' here are inconsistent with references to 'metadata' elsewhere in the document. It should be 'metadata' everywhere.
You shouldn't have a `library-name.js` file, as it will be auto generated by `ngc` in order to | ||
create a flat module, re-exporting the public API of your library. | ||
|
||
Below is a handy list for you to check if your entry points files are correctly build: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Typo: are correctly build:
-> are correctly built:
fe1d5c9
to
97c6e83
Compare
What is the status on this? Would love to have official Angular team guidance on creating these library apps. |
@filipesilva should we try to resurrect this guide and reuse it for the docs we'll need for the upcoming library support in CLI? or should we close this PR? cc: @jenniferfell |
@IgorMinar I think at this point too much has changed. The examples will not be applicable to the new source, and neither will be the explanations about internals. I think it should be closed but used as inspiration for a new one. The structure and the peripheral explanations still apply. |
Closing this one for now. |
This issue has been automatically locked due to inactivity. Read more about our automatic conversation locking policy. This action has been performed automatically by a bot. |
Please check if the PR fulfills these requirements
What kind of change does this PR introduce? (check one with "x")
What is the current behavior? (You can also link to an open issue here)
N/A
What is the new behavior?
A guide for third party library development is added. This PR is a port from angular/angular.io#3411.
Does this PR introduce a breaking change? (check one with "x")
If this PR contains a breaking change, please describe the impact and migration path for existing applications: ...
Other information:
For now the quickstart lib seed is hosted at https://github.com/filipesilva/angular-quickstart-lib. It should be hosted under the
angular
org upon release./cc @wardbell @alxhub