Skip to content

Commit 3bc5a4d

Browse files
arturovtarturovt
authored
feat(custom-esbuild): allow providing ESBuild plugins (#1536)
closes #1617 closes #1537 closes #1288
1 parent 0552485 commit 3bc5a4d

File tree

86 files changed

+4054
-4168
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

86 files changed

+4054
-4168
lines changed

‎README.md‎

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,8 @@ Builders' and Angular **major** versions **must** match.
2828

2929
# Builders
3030

31-
- [Custom webpack builders](./packages/custom-webpack) (an alternative to `ng eject`) [![npm version](https://img.shields.io/npm/v/@angular-builders/custom-webpack.svg) ![npm (tag)](https://img.shields.io/npm/v/@angular-builders/custom-webpack/next.svg) ![npm](https://img.shields.io/npm/dm/@angular-builders/custom-webpack.svg)](https://www.npmjs.com/package/@angular-builders/custom-webpack)
31+
- [Custom esbuild builders](./packages/custom-esbuild) (Allow customizing ESBuild configuration) [![npm version](https://img.shields.io/npm/v/@angular-builders/custom-esbuild.svg) ![npm (tag)](https://img.shields.io/npm/v/@angular-builders/custom-esbuild/next.svg) ![npm](https://img.shields.io/npm/dm/@angular-builders/custom-esbuild.svg)](https://www.npmjs.com/package/@angular-builders/custom-esbuild)
32+
- [Custom webpack builders](./packages/custom-webpack) (Allow customizing Webpack configuration) [![npm version](https://img.shields.io/npm/v/@angular-builders/custom-webpack.svg) ![npm (tag)](https://img.shields.io/npm/v/@angular-builders/custom-webpack/next.svg) ![npm](https://img.shields.io/npm/dm/@angular-builders/custom-webpack.svg)](https://www.npmjs.com/package/@angular-builders/custom-webpack)
3233
- [Jest builder](./packages/jest) (allows running `ng test` with Jest) [![npm version](https://img.shields.io/npm/v/@angular-builders/jest.svg) ![npm (tag)](https://img.shields.io/npm/v/@angular-builders/jest/next.svg) ![npm](https://img.shields.io/npm/dm/@angular-builders/jest.svg)](https://www.npmjs.com/package/@angular-builders/jest)
3334
- [Bazel builder](./packages/bazel) (`ng` wrapper for `Bazel` build) [![npm version](https://img.shields.io/npm/v/@angular-builders/bazel.svg) ![npm (tag)](https://img.shields.io/npm/v/@angular-builders/bazel/next.svg) ![npm](https://img.shields.io/npm/dm/@angular-builders/bazel.svg)](https://www.npmjs.com/package/@angular-builders/bazek)
3435
- [Timestamp builder](./packages/timestamp) (an example builder from [this](https://medium.com/@justjeb/angular-cli-6-under-the-hood-builders-demystified-f0690ebcf01) article) [![npm version](https://img.shields.io/npm/v/@angular-builders/timestamp.svg) ![npm (tag)](https://img.shields.io/npm/v/@angular-builders/timestamp/next.svg) ![npm](https://img.shields.io/npm/dm/@angular-builders/timestamp.svg)](https://www.npmjs.com/package/@angular-builders/timestamp)

‎examples/bazel/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -7,6 +7,6 @@
77
"private": true,
88
"devDependencies": {
99
"@angular-builders/bazel": "workspace:*",
10-
"@angular/cli": "17.0.10"
10+
"@angular/cli": "17.1.1"
1111
}
1212
}

‎examples/custom-esbuild/sanity-esbuild-app-esm/.editorconfig‎

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# Editor configuration, see https://editorconfig.org
2+
root = true
3+
4+
[*]
5+
charset = utf-8
6+
indent_style = space
7+
indent_size = 2
8+
insert_final_newline = true
9+
trim_trailing_whitespace = true
10+
11+
[*.md]
12+
max_line_length = off
13+
trim_trailing_whitespace = false

‎examples/custom-esbuild/sanity-esbuild-app-esm/.gitignore‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
# See http://help.github.com/ignore-files/ for more about ignoring files.
2+
3+
# compiled output
4+
/dist
5+
/tmp
6+
/out-tsc
7+
# Only exists if Bazel was run
8+
/bazel-out
9+
10+
# dependencies
11+
/node_modules
12+
13+
# profiling files
14+
chrome-profiler-events.json
15+
speed-measure-plugin.json
16+
17+
# IDEs and editors
18+
/.idea
19+
.project
20+
.classpath
21+
.c9/
22+
*.launch
23+
.settings/
24+
*.sublime-workspace
25+
26+
# IDE - VSCode
27+
.vscode/*
28+
!.vscode/settings.json
29+
!.vscode/tasks.json
30+
!.vscode/launch.json
31+
!.vscode/extensions.json
32+
.history/*
33+
34+
# misc
35+
/.angular/cache
36+
/.sass-cache
37+
/connect.lock
38+
/coverage
39+
/libpeerconnection.log
40+
npm-debug.log
41+
yarn-error.log
42+
testem.log
43+
/typings
44+
45+
# System Files
46+
.DS_Store
47+
Thumbs.db

‎examples/custom-esbuild/sanity-esbuild-app-esm/angular.json‎

Lines changed: 140 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,140 @@
1+
{
2+
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
3+
"version": 1,
4+
"newProjectRoot": "projects",
5+
"projects": {
6+
"sanity-esbuild-app-esm": {
7+
"projectType": "application",
8+
"schematics": {
9+
"@schematics/angular:component": {
10+
"style": "scss"
11+
}
12+
},
13+
"root": "",
14+
"sourceRoot": "src",
15+
"prefix": "app",
16+
"architect": {
17+
"build": {
18+
"builder": "@angular-builders/custom-esbuild:application",
19+
"options": {
20+
"plugins": ["esbuild/define-text-plugin.js"],
21+
"outputPath": "dist/sanity-esbuild-app-esm",
22+
"index": "src/index.html",
23+
"browser": "src/main.ts",
24+
"polyfills": ["zone.js"],
25+
"tsConfig": "tsconfig.app.json",
26+
"inlineStyleLanguage": "scss",
27+
"assets": ["src/favicon.ico", "src/assets"],
28+
"styles": ["src/styles.scss"],
29+
"scripts": []
30+
},
31+
"configurations": {
32+
"production": {
33+
"budgets": [
34+
{
35+
"type": "initial",
36+
"maximumWarning": "500kb",
37+
"maximumError": "1mb"
38+
},
39+
{
40+
"type": "anyComponentStyle",
41+
"maximumWarning": "2kb",
42+
"maximumError": "4kb"
43+
}
44+
],
45+
"outputHashing": "all"
46+
},
47+
"esm": {
48+
"plugins": ["esbuild/define-text-plugin.js"]
49+
},
50+
"cjs": {
51+
"plugins": ["esbuild/define-text-plugin.cjs"]
52+
},
53+
"tsEsm": {
54+
"plugins": ["esbuild/define-text-plugin.ts"]
55+
}
56+
},
57+
"defaultConfiguration": "production"
58+
},
59+
"serve": {
60+
"builder": "@angular-builders/custom-esbuild:dev-server",
61+
"options": {
62+
"forceEsbuild": true,
63+
"port": 5007
64+
},
65+
"configurations": {
66+
"production": {
67+
"buildTarget": "sanity-esbuild-app-esm:build:production"
68+
},
69+
"esm": {
70+
"buildTarget": "sanity-esbuild-app-esm:build:esm",
71+
"middlewares": ["esbuild/send-hello-middleware.js"]
72+
},
73+
"cjs": {
74+
"buildTarget": "sanity-esbuild-app-esm:build:cjs",
75+
"middlewares": ["esbuild/send-hello-middleware.cjs"]
76+
},
77+
"tsEsm": {
78+
"buildTarget": "sanity-esbuild-app-esm:build:tsEsm",
79+
"middlewares": ["esbuild/send-hello-middleware.ts"]
80+
}
81+
},
82+
"defaultConfiguration": "cjs"
83+
},
84+
"test": {
85+
"builder": "@angular-devkit/build-angular:karma",
86+
"options": {
87+
"polyfills": ["zone.js", "zone.js/testing"],
88+
"tsConfig": "tsconfig.spec.json",
89+
"karmaConfig": "karma.conf.cjs",
90+
"inlineStyleLanguage": "scss",
91+
"assets": ["src/favicon.ico", "src/assets"],
92+
"styles": ["src/styles.scss"],
93+
"scripts": []
94+
}
95+
},
96+
"e2e": {
97+
"builder": "@cypress/schematic:cypress",
98+
"options": {
99+
"devServerTarget": "sanity-esbuild-app-esm:serve",
100+
"browser": "chrome",
101+
"port": 4226
102+
},
103+
"configurations": {
104+
"production": {
105+
"devServerTarget": "sanity-esbuild-app-esm:serve:production"
106+
},
107+
"esm": {
108+
"devServerTarget": "sanity-esbuild-app-esm:serve:esm"
109+
},
110+
"cjs": {
111+
"devServerTarget": "sanity-esbuild-app-esm:serve:cjs"
112+
},
113+
"tsEsm": {
114+
"devServerTarget": "sanity-esbuild-app-esm:serve:tsEsm"
115+
}
116+
},
117+
"defaultConfiguration": "esm"
118+
},
119+
"cypress-run": {
120+
"builder": "@cypress/schematic:cypress",
121+
"options": {
122+
"devServerTarget": "sanity-esbuild-app-esm:serve"
123+
},
124+
"configurations": {
125+
"production": {
126+
"devServerTarget": "sanity-esbuild-app-esm:serve:production"
127+
}
128+
}
129+
},
130+
"cypress-open": {
131+
"builder": "@cypress/schematic:cypress",
132+
"options": {
133+
"watch": true,
134+
"headless": false
135+
}
136+
}
137+
}
138+
}
139+
}
140+
}

‎examples/custom-esbuild/sanity-esbuild-app-esm/cypress.config.js‎

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
import { defineConfig } from 'cypress';
2+
3+
export default defineConfig({
4+
video: false,
5+
screenshotOnRunFailure: false,
6+
e2e: {
7+
setupNodeEvents(on, config) {},
8+
specPattern: 'e2e/src/**/*.e2e-spec.ts',
9+
baseUrl: 'http://localhost:5001',
10+
supportFile: false,
11+
},
12+
});

‎examples/custom-esbuild/sanity-esbuild-app-esm/e2e/src/app.e2e-spec.ts‎

Lines changed: 23 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,23 @@
1+
import { AppPage } from './app.po';
2+
3+
describe('workspace-project App', () => {
4+
let page: AppPage;
5+
6+
beforeEach(() => {
7+
page = new AppPage();
8+
});
9+
10+
it('should display welcome message', () => {
11+
page.navigateTo();
12+
page
13+
.getTitle()
14+
.should(
15+
'have.text',
16+
'Welcome to sanity-esbuild-app-esm: This text is provided during the compilation!'
17+
);
18+
});
19+
20+
it('should display text from custom middleware', () => {
21+
cy.visit('/send-hello').get('h1').should('have.text', 'Hello text from middleware!');
22+
});
23+
});

‎examples/custom-esbuild/sanity-esbuild-app-esm/e2e/src/app.po.ts‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
export class AppPage {
2+
navigateTo() {
3+
return cy.visit('/');
4+
}
5+
6+
getTitle() {
7+
return cy.get('app-root h1');
8+
}
9+
}

‎examples/custom-esbuild/sanity-esbuild-app-esm/e2e/tsconfig.json‎

Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
{
2+
"extends": "../tsconfig.json",
3+
"include": ["**/*.ts"],
4+
"compilerOptions": {
5+
"sourceMap": false,
6+
"types": ["cypress"]
7+
}
8+
}

‎examples/custom-esbuild/sanity-esbuild-app-esm/esbuild/define-text-plugin.cjs‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
const defineTextPlugin = {
2+
name: 'define-text',
3+
setup(build) {
4+
const options = build.initialOptions;
5+
options.define.buildText = JSON.stringify('This text is provided during the compilation');
6+
},
7+
};
8+
9+
module.exports = defineTextPlugin;

0 commit comments

Comments
 (0)