javascript - How to create a ready to publish to npm angular 2 library -
i specific , divide question points.
1. want achieve in overall:
creating ready published npm angular 2 boilerplate library (latest version)
2. not working:
both tutorials beneath, cited @ stackoverflow earlier not working in many aspects or outdated or not clear. in internet there more confusion information how prepare valid , working angular 2 library.
https://medium.com/@ocombe/how-to-publish-a-library-for-angular-2-on-npm-5f48cdabf435#.c3yuzcrgj
3. want achieve in specific:
i know steps , summarize here essential creating library in latest angular 2 version scratch. code examples. may serve stackoverflowers future working boilerplate.
what propose write down shortest possible list needs done in points, code examples.
if understand question well, want create component , publish library.
1. create component
you need create foo.component.ts
file , html template. you'll prefer inline css (in styles
attribute of @component
).
!!! don't forget set moduleid: module.id
in @component
link template component using relative path !!!
2. compile code (once tested it, testing part implicit)
you need compile component using tsc
, tsconfig
should this:
{ "compileroptions": { "module": "commonjs", "moduleresolution": "node", "target": "es5", "sourcemap": true, "inlinesources": false, "declaration": false, "experimentaldecorators": true, "emitdecoratormetadata": true, "stripinternal": true, "skiplibcheck": true }, "files": [ "index.ts", "typings/index.d.ts" ] }
3. publish npm
first of all, create .npmignore file, here example:
.idea *.ts !*.d.ts /typings.json /typings/ /node_modules/ /.gitignore /.npmignore /.travis.yml /test /karma.conf.js /karma-test-shim.js /rollup.config.js /rollup-min.config.js /systemjs.config.js /tsconfig.json /tsconfig-build.json
if you're not using jetbrains ide, remove .idea
entry.
then set publish configuration in package.json
:
"publishconfig": { "registry": "https://registry.npmjs.org/" }
once ready, can npm publish
.
example
a example of external library angular2
can found here: https://github.com/noemi-salaun/ng2-logger/
or here more up-to-date one, including webpack compatibility: https://github.com/kaiu-lab/serializer
it's not component, whole publish config, bundling , testing logic done.
Comments
Post a Comment