ialexivy / vscode-angular2-files

vscode extension generating angular files with angular cli
MIT License
61 stars 36 forks source link

Don't work Generate component in folder 'src/app'... #51

Closed De-Su closed 4 years ago

De-Su commented 4 years ago

When I try to generate component in folder src/app it asks for the file name, but upon pressing enter, nothing happens. In any another folder Generate component is working. (example in src/app/home)

version 1.6.2 vscode 1.42.1. os win10 (1903) x64

structure image

ms0ur1s commented 4 years ago

Experiencing the same problem as above, I can generate a component in any directory but 'src/app'.

muhammedshaaban7 commented 4 years ago

any solution?

jdready66 commented 4 years ago

Also facing the same problem - can't pinpoint exactly when, but probably in the last 2-3 weeks (beginning of May). I tried running previous version of VS code - did not fix the problem. Mac Book Pro, VSCode v1.45.1.

jdready66 commented 4 years ago

Ok, I found the problem (at least with my project)...

When you 'Generate Component' in the app/src folder, 'Angular Files' tries to help you by adding the component to app.modules.ts. My problem is that my app.modules.ts has some odd looking additions to it like: ... FileUploadModule, JwtModule.forRoot({ config: { tokenGetter: tokenGetter, whitelistedDomains: ['localhost:5000'], blacklistedRoutes: ['localhost:5000/api/auth'], }, }), ], The JwtModule.forRoot() entry in the imports gets completely mangled by Angular Files.

Another example is this in my providers: { provide: HAMMER_GESTURE_CONFIG, useClass: CustomHammerConfig },

If I take these lines OUT of my app.module.ts file, I can generate components again.

luiz7s commented 4 years ago

I'm having the same issue trying to add a component on a newly fresh created application, so my app.module.ts looks pretty standard. I can create components in other folders, but not inside the src/app folder.

jdready66 commented 4 years ago

I'm having the same issue trying to add a component on a newly fresh created application, so my app.module.ts looks pretty standard. I can create components in other folders, but not inside the src/app folder.

I typically don't have the issue with a new project; however, I did look into the code and found what the actual issue is/was for me: The code does a simple string parsing routine where is look for a starting and ending string pattern for @NgModule: '@NgModule({' and ending with '})'.

In my case, I had the ending string '})' in a place that was INSIDE the @NgModule and NOT the actual end of the section.

Hope this helps.

luiz7s commented 4 years ago

Thanks for you answer @jdready66 !

I found the issue here based on your help. Here is how the section of NgModule of my app.module looked like:

@NgModule({ declarations: [AppComponent], imports: [BrowserModule, HttpClientModule], providers: [], bootstrap: [AppComponent], })

I removed the last comma, right after AppComponent and it worked.

Thank you very much!

jdready66 commented 4 years ago

Thanks for you answer @jdready66 !

I found the issue here based on your help. Here is how the section of NgModule of my app.module looked like:

@NgModule({ declarations: [AppComponent], imports: [BrowserModule, HttpClientModule], providers: [], bootstrap: [AppComponent], })

I removed the last comma, right after AppComponent and it worked.

Thank you very much!

Note that there's a formatter setting about adding trailing commas. Personally, I don't like them, but the default is to keep/add them. I think if you search in settings for "trailing comma", you can adjust that setting to your liking.