-
Notifications
You must be signed in to change notification settings - Fork 231
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
feat(angular): add Angular Renaissance & update Angular snippets #245
base: main
Are you sure you want to change the base?
Conversation
9d57e98
to
e4f2c7e
Compare
The build is failing, can you fix it ? As I said it's surely because of a change in |
I can take another look at it tomorrow but I couldn't find what was the issue there |
Well, I took a look at the code of the |
template: `<p>Page title: {{ pageTitle }}</p>`, | ||
}) | ||
export class PagetitleComponent implements OnInit { | ||
pageTitle = ""; |
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.
Any reason not to use signal here?
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.
Not at all, probably just a fail from my massive copy pasting
<p>I am {{ isAvailable() ? "available" : "not available" }}</p> | ||
`, | ||
}) | ||
export class UserprofileComponent { |
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.
p in Profile should be uppercase :) UserprofileComponent
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 agree with you but my goal was to make the least changes as the current version with is also lowercase.
I guess it's not a big deal and I could indeed update it both here and in the older (current) version
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 primary goal is to show Angular best practices, so if it musts be uppercase in the two cases, let's change both naming.
Can anyone tell what status of this PR is? Are there any issues? |
The status of this PR remains unchanged. I still have the same issues that the ones above and didn't have the time (and probably the knowledge) to fix them.
|
Ok, thanks. Maybe I will have a look if I find time for this. BTW, Angular 19 is making components " |
@LcsGa You introduce a bug and I have to solve it ? That's a little unfair. |
I never told you that you had to solve it yourself. I'm not familiar with the way of doing in the I don't clearly remember how to reproduce it righ now + I changed my computer but I will soon clone it once more, retry, and give more informations if :
The most that I remember at the moment is that I simply tried to build the projects with the provided commands but it failed right away |
Can you give the error logs to begin the investigation ? |
I didn't have the opportunity to retry yet but the error I faced was: pnpm run dev
> component-party.dev@2.0.0 dev /home/lucas/dev/component-party.dev
> vite
[generateFrameworkContent] Generating framework content files...
TypeError: Cannot read properties of undefined (reading 'push')
at file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2843:40
at async Promise.all (index 4)
at async generateContent (file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2831:7)
at async build (file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2981:7)
at async PluginContext.buildStart (file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2997:9)
at async Promise.all (index 6)
at async PluginContainer.hookParallel (file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:49481:5)
at async PluginContainer.buildStart (file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:49484:5)
at async file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:63425:7
at async httpServer.listen (file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:63440:9)
error when starting dev server:
TypeError: Cannot read properties of undefined (reading 'push')
at file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2843:40
at async Promise.all (index 4)
at async generateContent (file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2831:7)
at async build (file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2981:7)
at async PluginContext.buildStart (file:///home/lucas/dev/component-party.dev/vite.config.js.timestamp-1721509708644-d2f6b8691061.mjs:2997:9)
at async Promise.all (index 6)
at async PluginContainer.hookParallel (file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:49481:5)
at async PluginContainer.buildStart (file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:49484:5)
at async file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:63425:7
at async httpServer.listen (file:///home/lucas/dev/component-party.dev/node_modules/.pnpm/vite@5.3.4_@types+node@20.14.11_terser@5.31.3/node_modules/vite/dist/node/chunks/dep-D8YhmIY-.js:63440:9)
ELIFECYCLE Command failed with exit code 1. |
e4f2c7e
to
b277cc5
Compare
@LcsGa I found the problem. In See "emberOctane" for example |
declarations: [NameComponent], | ||
exports: [NameComponent], | ||
}) | ||
export class NameModule {} |
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.
Just use standalone: true
in all components and get rid of the @NgModule
. They are no longer needed.
In Angular v19
standalone: true
will be the default.
export class InputfocusedComponent implements OnInit { | ||
inputRef = viewChild.required<ElementRef<HTMLInputElement>>("inputRef"); | ||
|
||
ngOnInit() { |
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.
Might be a good idea to replace with an effect()
.
export class TimeComponent implements OnDestroy { | ||
time = signal(new Date().toLocaleTimeString()); | ||
|
||
timer = setInterval( |
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.
Just use rxjs
+ toSignal()
and get rid of ngOnDestroy
:
time$ = timer(0, 1e3)
.pipe(
map(() => new Date().toLocaleTimeString())
);
time = toSignal(this.time$);
}; | ||
|
||
updateUsername(username: string) { | ||
this.user.username = username; |
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.
Immutability 😉
imports: [FormsModule], | ||
selector: "app-input-hello", | ||
template: ` | ||
<p>{{ text }}</p> |
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.
Should be {{ text() }}
with parenthesis since it's signal.
imports: [FormsModule], | ||
selector: "app-pick-pill", | ||
template: ` | ||
<div>Picked: {{ picked }}</div> |
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.
picked()
import { AppModule } from "./app.module"; | ||
|
||
platformBrowserDynamic() | ||
.bootstrapModule(AppModule) |
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.
No more modules.
bootstrapApplication(AppComponent, appConfig)
.catch((err) => console.error(err));
Oh my... I really didn't notice that... The most time consuming bugs are always the most stupid ones I guess... |
I added the modules on purpose! Before angular v14 that was mandatory to create components. Yeah sure! I can do that tomorrow morning I think! 😁 |
Solves the issue #241