Git Product home page Git Product logo

Comments (12)

PatrickJS avatar PatrickJS commented on August 19, 2024

are you saying you want to type a class that have Component in the name and have it auto include the decorator? so

export class AppComponent  {
}

with have

@Component({})
export class AppComponent  {
}

or auto inject imports?
so

@Component({})
export class AppComponent  {
}

with have

import { Component } from '@angular/core';
@Component({})
export class AppComponent  {
}

from angular2-conventions-loader.

SebastianStehle avatar SebastianStehle commented on August 19, 2024

No, sorry.

I am too lazy to include all types in the import (especially for Components where you have OnInit, OnDestroy, Changes, ElementRef, Renderer ...)

Therefore I just use:

 import * as Ng2 from '@angular/core';

 @Ng2.Component({ ... });
 export class MyComponent {
 }

I tried to integrate it yesterday. The idea was to add an ngAlias parameter and then to do some replaces before the Line 87

 var ngAlias = '';
 if (query.ngAlias && typeof query.ngAlias === 'string') {
     ngAlias = query.ngAlias + '.';
 }
 if (ngAlias) {
      source = source.replace(new RegExp('@' + ngAlias + 'Component', '@Component');
      source = source.replace(new RegExp('@' + ngAlias + 'Directive', '@Directive');
 }

and change Line 166 to

 return @' + ngAlias + decorator + '({' + metadata + '})';

But I got some exceptions in Line 117 because 'src' was undefined.

from angular2-conventions-loader.

PatrickJS avatar PatrickJS commented on August 19, 2024

ok ya I can fix this

from angular2-conventions-loader.

awerlang avatar awerlang commented on August 19, 2024

Would an IDE be able to deal with this? How would it recognized where Component() is from?

from angular2-conventions-loader.

SebastianStehle avatar SebastianStehle commented on August 19, 2024

The IDE?

from angular2-conventions-loader.

awerlang avatar awerlang commented on August 19, 2024

I mean this:

image

from angular2-conventions-loader.

SebastianStehle avatar SebastianStehle commented on August 19, 2024

You mean it can generate the imports? Probably, but VS Code cannot, or at least not with a single click ;)

from angular2-conventions-loader.

awerlang avatar awerlang commented on August 19, 2024

Yes, IDEs are meant to help with this. WebStorm can do it, and VS Code maybe someday.

What I meant is if you omit this prefix on your source code and having a plugin injecting it on transpilation, you'll lose all the goodness in the IDE e.g. intellisense, type checking, etc. Unless the IDE implement this convention, which is unlikely.

from angular2-conventions-loader.

SebastianStehle avatar SebastianStehle commented on August 19, 2024

I dont understand what you mean. I use this prefix/alias because I dont like long import statements, e.g.

 import { Component, Input, Output, OnChanges, OnInit, OnDestroy } from '@angular/core';

You can use any alias you want, it is valid typescript and you get intellisense for it. But this package here, does not recognize aliases, because it tries to find '@component' in the code. I am confused at the moment :D

from angular2-conventions-loader.

SebastianStehle avatar SebastianStehle commented on August 19, 2024

@gdi2290 are you going to add this feature?

from angular2-conventions-loader.

michaeljota avatar michaeljota commented on August 19, 2024

To autoimport (and other goods) try Typescript Hero

@SebastianStehle did you try Typescript Hero? Did it work as you expected? I know everyone it's free to work as they think it's better, but destructing imports have it's benefits, even more when you are working with Webpack and a tree shaking-like feature.

from angular2-conventions-loader.

SebastianStehle avatar SebastianStehle commented on August 19, 2024

Yes, I migrated my code. The tree shaking might not work correctly but i have seen no difference in the size of the bundle.

from angular2-conventions-loader.

Related Issues (10)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.