angular-library | 易学教程

Angular error while building because external library - Unexpected value “BannerModule…”

阅读更多关于 Angular error while building because external library - Unexpected value “BannerModule…”

问题 I created a library in order to share some components between two different projects, using ng-packagr module. The structure of the lib is In my library The src/package.json : { "name": "my-ng-library", "version": "0.0.0", "license": "MIT", "ngPackage": { "$schema": "./node_modules/ng-packagr/ng-package.schema.json", "lib": { "entryFile": "index.ts" }, "dest": "../dist" }, "private": false, "dependencies": {}, "peerDependencies": { "@angular/platform-browser": "^5.2.0", "@angular/platform

Angular html file not found in component library

阅读更多关于 Angular html file not found in component library

问题 I'm building a component library for angular which we will share across projects. But when i build the package the html files don't get copied to the dist folder. I get the error angular Failed to load text-input.component.html . This is my tsconfig.json: { "compileOnSave": false, "compilerOptions": { "outDir": "./dist", "baseUrl": "src", "sourceMap": true, "declaration": false, "moduleResolution": "node", "emitDecoratorMetadata": true, "experimentalDecorators": true, "target": "es5",

Configuration 'production' could not be found in project 'my-lib'

阅读更多关于 Configuration 'production' could not be found in project 'my-lib'

问题 I am building a library with Angular 6.1.0 ng new lib-demo ng generate library my-lib All the articles advise running the build for the library with a --prod flag like so: ng build my-lib --prod However, this throws an error Configuration 'production' could not be found in project 'my-lib'. Which is probably correct because when I look at the angular.json there is no definition for a production build configuration in the library project. It is present for the application project only. the

Angular Module vs. Library

阅读更多关于 Angular Module vs. Library

So great, the Angular has released version 6 and the CLI provides an option to generate libraries - something that they call a "highly anticipated feature". Now, coming from a business perspective, I am wondering: why you would actually need this, why inside of an existing project and not a separate which you can install as usual via npm... and if you want this inside your project, why not use a module for that. So I get it, publish something on npmjs and hope the whole world and future connected things need exactly that. Library, great. Inside a big system in a even bigger company, we could

Angular 6 Library - bootstrap styles

阅读更多关于 Angular 6 Library - bootstrap styles

I'm currently experimenting with creating Angular 6 libraries and consuming them in other applications. It seems to be working well. I am following: https://medium.com/@SirMaxxx/angular-6-creating-a-shareable-control-library-6a27f0ebe5c2 A problem that I am having is adding dependencies to such libraries, in particular with bootstrap. What I am trying to do is to create a component library, which comes bundled with custom and 3rd party styles, however there does not seem to be a way to do that? I would expect to add references to bootstrap to angular.json file similar to below: "styles": [

Angular Library Modules export components, services and others from module

阅读更多关于 Angular Library Modules export components, services and others from module

I have created an Angular Library. In my Library I would it like it to be clean by having feature modules inside them: Example: Library NavigationModule NavigationSideBarComponent NavigationTopComponent Navigation Service etc GraphModule BarGraphComponent PieGraphComponent My Navigation Module currently looks like this: @NgModule({ declarations: [ NavigationSidebarComponent ], imports: [ CommonModule, MatSidenavModule ], exports: [ NavigationSidebarComponent ] }) export class NavigationModule { } My Library Module currently looks like this: @NgModule({ declarations: [LibraryComponent], imports

How to have absolute import paths in a library project?

阅读更多关于 How to have absolute import paths in a library project?

问题 I have a library with a workspace containing two projects, one for the library itself and one for a test application. ├── projects ├── midi-app └── midi-lib In the workspace tsconfig.json file I configured some @app and @lib paths: "paths": { "@app/*": ["projects/midi-app/src/app/*"], "@lib/*": ["projects/midi-lib/src/lib/*"], "midi-lib": [ "dist/midi-lib" ], "midi-lib/*": [ "dist/midi-lib/*" ] } There is a projects/midi-lib/tsconfig.lib.json file which extends on the above tsconfig.json file

Angular 6 Convert an Application to Library

阅读更多关于 Angular 6 Convert an Application to Library

问题 I have an Angular 6 app that handles routes like 'page-not-found', 'error', 'unauthorized.' This how my routes look: const appRoutes: Routes = [ { path:'page-not-found', component: NotFoundPageComponent }, { path: 'unauthorized', component: UnAuthorizedPageComponent }, { path: 'error', component: ErrorPageComponent }, { path: '**', component: NotFoundPageComponent }, ]; All the components have simple html template like below: <p>Page Not Found. Please report this error to system administrator

How does one go about creating an Angular library wrapper for an existing Javascript library?

阅读更多关于 How does one go about creating an Angular library wrapper for an existing Javascript library?

Suppose there exists a Javascript library written in plain Javascript and commonly used on vanilla, non-frameworked websites. How does one go about creating an Angular library that can easily be npm install ed that would make the library seamless to use in an Angular app? I cannot find any good demonstrations of this process in the Angular docs or on the wider web. Just for instance, there is a fantastic Javascript library called p5.js , which is not straightforward to use with Angular. How would one go about creating an Angular module that you can simply import into your own Angular module

Can I have angular library that emits Angular elements in single js file?

阅读更多关于 Can I have angular library that emits Angular elements in single js file?

问题 I'm starting to get into the angular 6 bits, and am very interested in Angular Elements as well as the new library projects. I have an upcoming project that will probably need both these new features. I have the need to create custom UI components that are reusable across web frameworks, but I'd also like to have first class support for using them in angular projects. I've followed this tutorial and have an angular6 app that registers custom elements, and concats the webpack bundles in a