Resources & Tools
-- Thank you for using and showing some ♥ for Nx. -
-
- If you like Nx, please give it a star:
-
`,
};
diff --git a/packages/angular/src/generators/application/lib/update-component-template.ts b/packages/angular/src/generators/application/lib/update-app-component-template.ts
similarity index 76%
rename from packages/angular/src/generators/application/lib/update-component-template.ts
rename to packages/angular/src/generators/application/lib/update-app-component-template.ts
index 049b06f6400f2..2ec7041167d0c 100644
--- a/packages/angular/src/generators/application/lib/update-component-template.ts
+++ b/packages/angular/src/generators/application/lib/update-app-component-template.ts
@@ -7,10 +7,15 @@ import { getDecoratorPropertyValueNode } from '../../../utils/nx-devkit/ast-util
import { nrwlHomeTemplate } from './nrwl-home-tpl';
-export function updateComponentTemplate(host: Tree, options: NormalizedSchema) {
+export function updateAppComponentTemplate(
+ host: Tree,
+ options: NormalizedSchema
+) {
const content = options.routing
- ? `${nrwlHomeTemplate.html}\n
-
- Star
+ getSelector: (prefix) => `<${prefix}-nx-welcome>`,
+ template: (title) => `
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+ + Hello there, + Welcome ${title} 👋 +
+
+
-
+
-
- + + You're up and running +
+ What's next?- Here are some links to help you get started. -
--
-
- - + +
+
+
+
+
+
-
+
+
+ Documentation
+ Everything is in there
+
+
-
-
+
+
+
+
-
-
-
-
- Nx Cloud
-
-
-
-
+ Learning materials
+ + - -Next Steps
-Here are some things you can do with Nx.
-
-
- Add UI library
-- # Generate UI lib - nx g @nrwl/angular:lib ui - - # Add a component - nx g @nrwl/angular:component xyz --project ui-
-
- View dependency graph
-nx dep-graph-
-
Run affected commands
-- # see what's been affected by changes - nx affected:dep-graph - - # run tests for current changes - nx affected:test - - # run e2e tests for current changes - nx affected:e2e -+ + + Blog + Changelog, features & events + + + + + + + YouTube channel + Nx Show, talks & tutorials + + + + + + + Interactive tutorials + Create an app, step-by-step + + + + + + + Video courses + Nx custom courses + + + +
+
+
+
+ Install Nx Console
+ Plugin for VSCode
+
+
+
+
+
+
+
+
+ Nx is open source
+ Love Nx? Give us a star!
+
+
+
+
+
+ + NxCloud + + Enable faster CI & better DX + +
++ You can activate distributed tasks executions and caching by + running: +
+nx connect-to-nx-cloud+ What is Nx Cloud? +
+
+
+ Next steps
+Here are some things you can do with Nx:
+
+
+ + + Add UI library +
+# Generate UI lib +nx g @nrwl/angular:lib ui + +# Add a component +nx g @nrwl/angular:component button --project ui+
+
+ + + View interactive dependency graph +
+nx dep-graph+
+
+ + + Run affected commands +
+# see what's been affected by changes +nx affected:dep-graph + +# run tests for current changes +nx affected:test + +# run e2e tests for current changes +nx affected:e2e+
+ Carefully crafted with + +
+Welcome to <%= projectName %>!
+ <> + - -Welcome to <%= projectName %>!
-Resources & Tools
-Thank you for using and showing some ♥ for Nx.
- -Here are some links to help you get started.
--
-
- - - Scale React Development with Nx (Course) - - -
- - - Interactive tutorial - - -
- - - - Nx Cloud - - -
Next Steps
-Here are some things you can do with Nx.
-
-
- Add UI library
-{`# Generate UI lib
-nx g @nrwl/react:lib ui
-
-# Add a component
-nx g @nrwl/react:component xyz --project ui`}
-
-
- View dependency graph
-{`nx dep-graph`}
-
-
- Run affected commands
-{`# see what's been affected by changes
-nx affected:dep-graph
-
-# run tests for current changes
-nx affected:test
-
-# run e2e tests for current changes
-nx affected:e2e
- `}
- Welcome to <%= projectName %>!
-Resources & Tools
-- Thank you for using and showing some ♥ for Nx. -
- -- Here are some links to help you get started. -
--
-
- - - Scale React Development with Nx (Course) - - -
- - - Interactive tutorial - - -
- - - - Nx Cloud - - -
Next Steps
-- Here are some things you can do with Nx. -
-
-
- Add UI library
-{`# Generate UI lib
-nx g @nrwl/react:lib ui
-
-# Add a component
-nx g @nrwl/react:component xyz --project ui`}
-
-
- View dependency graph
-{`nx dep-graph`}
-
-
- Run affected commands
-{`# see what's been affected by changes
-nx affected:dep-graph
-
-# run tests for current changes
-nx affected:test
-
-# run e2e tests for current changes
-nx affected:e2e
- `}
- Welcome to ${title}!
-Resources & Tools
-- Thank you for using and showing some ♥ for Nx. -
-
- If you like Nx, please give it a star:
-
-
- Star
-
-
+
+
+ `;
}
}
customElements.define('<%= prefix %>-root', AppElement);
+
+
+
+
- + Hello there, + Welcome ${title} 👋 +
- Here are some links to help you get started. -
--
-
-
-
- Nx video course
+
+
+ ++ + +++
+ + You're up and running +
+ What's next? ++ +++-# Add a component -nx g @nrwl/web:component xyz --project ui\` - - -++Learning materials
+ + + + Documentation + Everything is in there + + - -- - - Nx video tutorial + + + + Blog + Changelog, features & events + + -
-- - - Interactive tutorial + + + + YouTube channel + Nx Show, talks & tutorials + + -
-- - - - Nx Cloud + + + + Interactive tutorials + Create an app, step-by-step + + -
- -Next Steps
-Here are some things you can do with Nx.
--Add UI library
--\`# Generate UI lib -nx g @nrwl/web:lib ui + + + + Video courses + Nx custom courses + + + +
+ + + + Install Nx Console + Plugin for VSCode + + ++++ + + + Nx is open source + Love Nx? Give us a star! + + ++ +++ NxCloud + + Enable faster CI & better DX + +
++ You can activate distributed tasks executions and caching by + running: +
+nx connect-to-nx-cloud
+ What is Nx Cloud? +--View dependency graph
-\`nx dep-graph\`
--Run affected commands
--\`# see what's been affected by changes + +
++ +Next steps
+Here are some things you can do with Nx:
++++ + Add UI library +
+# Generate UI lib +nx g @nrwl/angular:lib ui + +# Add a component +nx g @nrwl/angular:component button --project ui
++++ + View interactive dependency graph +
+nx dep-graph
++- `; +# run e2e tests for current changes +nx affected:e2e + ++ + Run affected commands +
+# see what's been affected by changes nx affected:dep-graph -# run tests for current changes +# run tests for current changes nx affected:test -# run e2e tests for current changes -nx affected:e2e\` -
-+ Carefully crafted with + +
+