@ng-rsbuild/plugin-angular
Version:
Rsbuild Plugin for building Angular.
89 lines (64 loc) • 2.58 kB
Markdown
<div style="text-align: center;">
<div style="background-color: orange; padding: 1rem; border-radius: 0.5rem; font-weight: bold; margin-top: 1rem;">
This package has been moved to @nx/angular-rsbuild.
</div>
<img src="http://github.com/nrwl/angular-rspack/raw/main/rsbuild-plugin-angular.png" alt="Rsbuild Plugin Angular" />
</div>
Plugin providing Rsbuild support for Angular applications, both SSR and CSR.
**_Thank you to [Brandon Roberts](https://x.com/brandontroberts) and [Analog](https://analogjs.org/) for their work on building Angular applications with Vite which both inspired this plugin and provided a basis for the compilation implementation._**
**Prerequisites**: Angular SSR Application already created with `ng new --ssr`.
1. Install Rsbuild: `npm install --save-dev @rsbuild/core`
2. Install this plugin: `npm install --save-dev @ng-rsbuild/plugin-angular`
3. Create an `rsbuild.config.ts` file at the root of your project with the following:
```ts
import { createConfig } from '@ng-rsbuild/plugin-angular';
export default createConfig({
browser: './src/main.ts',
server: './src/main.server.ts',
ssrEntry: './src/server.ts',
});
```
4. Update your `./src/server.ts` file to use the `createServer` util:
```ts
import { createServer } from '@ng-rsbuild/plugin-angular/ssr';
import bootstrap from './main.server';
const server = createServer(bootstrap);
/** Add your custom server logic here
*
* For example, you can add a custom static file server:
*
* server.app.use('/static', express.static(staticFolder));
*
* Or add additional api routes:
*
* server.app.get('/api/hello', (req, res) => {
* res.send('Hello World!');
* });
*
* Or add additional middleware:
*
* server.app.use((req, res, next) => {
* res.send('Hello World!');
* });
*/
server.listen();
```
5. Run the builds: `npx rsbuild build`
6. Run the server: `node dist/server/server.js`
7. Run the dev server: `npx rsbuild dev`
**Prerequisites**: Angular CSR Application already created with `ng new`.
1. Install Rsbuild: `npm install --save-dev @rsbuild/core`
2. Install this plugin: `npm install --save-dev @ng-rsbuild/plugin-angular`
3. Create an `rsbuild.config.ts` file at the root of your project with the following:
```ts
import { createConfig } from '@ng-rsbuild/plugin-angular';
export default createConfig({
browser: './src/main.ts',
});
```
4. Run the builds: `npx rsbuild build`
5. Run the dev server: `npx rsbuild dev`