From 73b618035367d8903d86f6ba795ab34e136b53d3 Mon Sep 17 00:00:00 2001 From: Brandon Date: Mon, 5 Dec 2022 15:44:03 -0600 Subject: [PATCH] feat(create-analog): update Angular v15 template to use @nrwl/vite package (#168) --- apps/analog-app/project.json | 3 +- package.json | 6 +- .../template-angular-v15/.vscode/launch.json | 7 +-- .../template-angular-v15/README.md | 4 +- .../template-angular-v15/angular.json | 39 ++++++++++++- .../template-angular-v15/package.json | 15 ++--- .../template-angular-v15/src/index.html | 4 +- .../template-angular-v15/src/main.ts | 2 +- .../template-angular-v15/src/polyfills.ts | 52 ----------------- .../template-angular-v15/tsconfig.app.json | 2 +- .../template-angular-v15/tsconfig.spec.json | 2 +- .../template-angular-v15/vite.config.ts | 15 +---- yarn.lock | 56 ++++++++++++------- 13 files changed, 98 insertions(+), 109 deletions(-) delete mode 100644 packages/create-analog/template-angular-v15/src/polyfills.ts diff --git a/apps/analog-app/project.json b/apps/analog-app/project.json index 647b06dfa..ee1fc8e12 100644 --- a/apps/analog-app/project.json +++ b/apps/analog-app/project.json @@ -80,8 +80,7 @@ "hmr": true }, "production": { - "buildTarget": "analog-app:build:production", - "hmr": false + "buildTarget": "analog-app:build:production" } } }, diff --git a/package.json b/package.json index ad5f4daab..e6838ef0f 100644 --- a/package.json +++ b/package.json @@ -66,7 +66,7 @@ "@nrwl/linter": "15.2.1", "@nrwl/vite": "15.2.1", "@nrwl/workspace": "15.2.1", - "@nx-plus/docusaurus": "14.1.0", + "@nx-plus/docusaurus": "15.0.0-rc.0", "@swc/helpers": "^0.4.13", "@types/jest": "29.1.2", "@types/node": "18.8.4", @@ -101,8 +101,8 @@ "ts-jest": "29.0.3", "ts-node": "10.9.1", "typescript": "4.8.4", - "vite": "^3.1.7", - "vitest": "^0.24.1", + "vite": "^3.2.3", + "vitest": "^0.25.1", "webpack-bundle-analyzer": "^4.6.1" } } diff --git a/packages/create-analog/template-angular-v15/.vscode/launch.json b/packages/create-analog/template-angular-v15/.vscode/launch.json index 740e35a0c..57dbf761e 100644 --- a/packages/create-analog/template-angular-v15/.vscode/launch.json +++ b/packages/create-analog/template-angular-v15/.vscode/launch.json @@ -4,17 +4,16 @@ "configurations": [ { "name": "ng serve", - "type": "pwa-chrome", + "type": "chrome", "request": "launch", "preLaunchTask": "npm: start", - "url": "http://localhost:4200/" + "url": "http://localhost:5173/" }, { "name": "ng test", "type": "chrome", "request": "launch", - "preLaunchTask": "npm: test", - "url": "http://localhost:9876/debug.html" + "preLaunchTask": "npm: test" } ] } diff --git a/packages/create-analog/template-angular-v15/README.md b/packages/create-analog/template-angular-v15/README.md index 904f5ce7e..4422db6b7 100644 --- a/packages/create-analog/template-angular-v15/README.md +++ b/packages/create-analog/template-angular-v15/README.md @@ -1,6 +1,6 @@ # Analog App -This project was generated with [Analog](https://npmjs.com/package/create-analog). +This project was generated with [Analog](https://analogjs.org), the fullstack meta-framework for Angular. ## Setup @@ -12,7 +12,7 @@ Run `yarn dev` for a dev server. Navigate to `http://localhost:5173/`. The appli ## Build -Run `yarn build` to build the project. The build artifacts will be stored in the `dist/` directory. +Run `yarn build` to build the client/server project. The client build artifacts are located in the `dist/client` directory. The server for the API build artifacts are located in the `dist/server` directory. ## Test diff --git a/packages/create-analog/template-angular-v15/angular.json b/packages/create-analog/template-angular-v15/angular.json index 836e33321..98d5ce2a8 100644 --- a/packages/create-analog/template-angular-v15/angular.json +++ b/packages/create-analog/template-angular-v15/angular.json @@ -5,12 +5,47 @@ "projects": { "my-app": { "projectType": "application", - "schematics": {}, "root": "", "sourceRoot": "src", "prefix": "app", "architect": { - "targets": {} + "build": { + "builder": "@nrwl/vite:build", + "options": { + "configFile": "vite.config.ts", + "outputPath": "dist/client" + }, + "defaultConfiguration": "production", + "configurations": { + "development": {}, + "production": { + "sourcemap": false + } + } + }, + "serve": { + "builder": "@nrwl/vite:dev-server", + "defaultConfiguration": "development", + "options": { + "buildTarget": "my-app:build", + "port": 5173 + }, + "configurations": { + "development": { + "buildTarget": "my-app:build:development", + "hmr": true + }, + "production": { + "buildTarget": "my-app:build:production" + } + } + }, + "test": { + "builder": "@nrwl/vite:test", + "options": { + "config": "vite.config.ts" + } + } } } } diff --git a/packages/create-analog/template-angular-v15/package.json b/packages/create-analog/template-angular-v15/package.json index c7540688e..f3e7a15d1 100644 --- a/packages/create-analog/template-angular-v15/package.json +++ b/packages/create-analog/template-angular-v15/package.json @@ -6,12 +6,12 @@ "node": ">=16.0.0" }, "scripts": { - "dev": "vite", + "dev": "ng serve", "ng": "ng", - "start": "npm run dev", - "build": "vite build", - "watch": "vite build --watch", - "test": "vitest" + "start": "ng serve", + "build": "ng build", + "watch": "ng build --watch", + "test": "ng test" }, "dependencies": { "@analogjs/router": "latest", @@ -32,9 +32,10 @@ "@angular-devkit/build-angular": "^15.0.0", "@angular/cli": "~15.0.0", "@angular/compiler-cli": "^15.0.0", + "@nrwl/vite": "^15.2.0", "jsdom": "^20.0.0", "typescript": "~4.8.4", - "vite": "^3.0.9", - "vitest": "^0.22.1" + "vite": "^3.2.3", + "vitest": "^0.25.1" } } diff --git a/packages/create-analog/template-angular-v15/src/index.html b/packages/create-analog/template-angular-v15/src/index.html index 7519e0418..ff244b75d 100644 --- a/packages/create-analog/template-angular-v15/src/index.html +++ b/packages/create-analog/template-angular-v15/src/index.html @@ -6,10 +6,10 @@ - + - + diff --git a/packages/create-analog/template-angular-v15/src/main.ts b/packages/create-analog/template-angular-v15/src/main.ts index 572e260c6..c630734a0 100644 --- a/packages/create-analog/template-angular-v15/src/main.ts +++ b/packages/create-analog/template-angular-v15/src/main.ts @@ -1,4 +1,4 @@ -import './polyfills'; +import 'zone.js'; import { bootstrapApplication } from '@angular/platform-browser'; import { provideFileRouter } from '@analogjs/router'; diff --git a/packages/create-analog/template-angular-v15/src/polyfills.ts b/packages/create-analog/template-angular-v15/src/polyfills.ts deleted file mode 100644 index e4555ed11..000000000 --- a/packages/create-analog/template-angular-v15/src/polyfills.ts +++ /dev/null @@ -1,52 +0,0 @@ -/** - * This file includes polyfills needed by Angular and is loaded before the app. - * You can add your own extra polyfills to this file. - * - * This file is divided into 2 sections: - * 1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers. - * 2. Application imports. Files imported after ZoneJS that should be loaded before your main - * file. - * - * The current setup is for so-called "evergreen" browsers; the last versions of browsers that - * automatically update themselves. This includes recent versions of Safari, Chrome (including - * Opera), Edge on the desktop, and iOS and Chrome on mobile. - * - * Learn more in https://angular.io/guide/browser-support - */ - -/*************************************************************************************************** - * BROWSER POLYFILLS - */ - -/** - * By default, zone.js will patch all possible macroTask and DomEvents - * user can disable parts of macroTask/DomEvents patch by setting following flags - * because those flags need to be set before `zone.js` being loaded, and webpack - * will put import in the top of bundle, so user need to create a separate file - * in this directory (for example: zone-flags.ts), and put the following flags - * into that file, and then add the following code before importing zone.js. - * import './zone-flags'; - * - * The flags allowed in zone-flags.ts are listed here. - * - * The following flags will work for all browsers. - * - * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame - * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick - * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames - * - * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js - * with the following flag, it will bypass `zone.js` patch for IE/Edge - * - * (window as any).__Zone_enable_cross_context_check = true; - * - */ - -/*************************************************************************************************** - * Zone JS is required by default for Angular itself. - */ -import 'zone.js'; // Included with Angular CLI. - -/*************************************************************************************************** - * APPLICATION IMPORTS - */ diff --git a/packages/create-analog/template-angular-v15/tsconfig.app.json b/packages/create-analog/template-angular-v15/tsconfig.app.json index 1899ecfe4..8d472295c 100644 --- a/packages/create-analog/template-angular-v15/tsconfig.app.json +++ b/packages/create-analog/template-angular-v15/tsconfig.app.json @@ -6,6 +6,6 @@ "outDir": "./out-tsc/app", "types": [] }, - "files": ["src/main.ts", "src/polyfills.ts"], + "files": ["src/main.ts"], "include": ["src/**/*.d.ts", "src/app/routes/**/*.ts"] } diff --git a/packages/create-analog/template-angular-v15/tsconfig.spec.json b/packages/create-analog/template-angular-v15/tsconfig.spec.json index 071a74e46..5625f7b63 100644 --- a/packages/create-analog/template-angular-v15/tsconfig.spec.json +++ b/packages/create-analog/template-angular-v15/tsconfig.spec.json @@ -6,6 +6,6 @@ "outDir": "./out-tsc/spec", "types": ["node", "vitest/globals"] }, - "files": ["src/test.ts", "src/polyfills.ts"], + "files": ["src/test.ts"], "include": ["src/**/*.spec.ts", "src/**/*.ts"] } diff --git a/packages/create-analog/template-angular-v15/vite.config.ts b/packages/create-analog/template-angular-v15/vite.config.ts index a1143286a..dce5e5166 100644 --- a/packages/create-analog/template-angular-v15/vite.config.ts +++ b/packages/create-analog/template-angular-v15/vite.config.ts @@ -5,15 +5,9 @@ import analog from '@analogjs/platform'; // https://vitejs.dev/config/ export default defineConfig(({ mode }) => ({ - root: 'src', - publicDir: 'assets', - optimizeDeps: { - exclude: ['@analogjs/router'], - }, + publicDir: 'src/assets', build: { - outDir: `../dist/my-app/client`, - emptyOutDir: true, - target: 'es2022', + target: ['es2020'], }, resolve: { mainFields: ['module'], @@ -22,11 +16,8 @@ export default defineConfig(({ mode }) => ({ test: { globals: true, environment: 'jsdom', - setupFiles: ['test.ts'], + setupFiles: ['src/test.ts'], include: ['**/*.spec.ts'], - cache: { - dir: `../node_modules/.vitest`, - }, }, define: { 'import.meta.vitest': mode !== 'production', diff --git a/yarn.lock b/yarn.lock index 54dcbd6b0..47281ff9a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -3343,14 +3343,15 @@ semver "7.3.4" tslib "^2.3.0" -"@nrwl/devkit@^14.3.6": - version "14.8.3" - resolved "https://registry.yarnpkg.com/@nrwl/devkit/-/devkit-14.8.3.tgz#c73230d48970f34257e59c820a86920d66380d82" - integrity sha512-jEH+oKS4F4MJvoIe0Zw6zUODO2j2ib7f+62D4lMDKl5qopcgnKyU9rVnSCDolqCH81j326dfr8b7FfE6Z7p71A== +"@nrwl/devkit@^15.0.0": + version "15.2.4" + resolved "https://registry.yarnpkg.com/@nrwl/devkit/-/devkit-15.2.4.tgz#ffcb69f462df19d3d282cf25bf346926ee23f141" + integrity sha512-5JZWB4ydnu+NKNIfj958nML8AWwhareQ+Q1hLXoOIS/7brqfALNP3y/Ef1ljrLIo1f3xc484TPclqwSH7aRdvQ== dependencies: "@phenomnomnominal/tsquery" "4.1.1" ejs "^3.1.7" ignore "^5.0.4" + semver "7.3.4" tslib "^2.3.0" "@nrwl/eslint-plugin-nx@15.2.1": @@ -3529,12 +3530,12 @@ yargs "^17.6.2" yargs-parser "21.1.1" -"@nx-plus/docusaurus@14.1.0": - version "14.1.0" - resolved "https://registry.yarnpkg.com/@nx-plus/docusaurus/-/docusaurus-14.1.0.tgz#0d919aada8cd94b986fc74e8dc604ba06491dbdc" - integrity sha512-EjzaOm8GCpyADKn4G19AgZk/l8F5eyNCVN1oFki7KUPaig9N9IjRCEmUQtHuomGbCQRqHtpovEPJldCLRz4glw== +"@nx-plus/docusaurus@15.0.0-rc.0": + version "15.0.0-rc.0" + resolved "https://registry.yarnpkg.com/@nx-plus/docusaurus/-/docusaurus-15.0.0-rc.0.tgz#3233637ed3678d7be491ee3c2f9fb3c6ca407f25" + integrity sha512-GmoYHKljQJvJLSYhWBe+huStwJbm+RbK+lC2j2sA+ZCUdkUo+P2Yv5oQGbqWU4jXclYe8pOP/qVFJs3j3Zjw/Q== dependencies: - "@nrwl/devkit" "^14.3.6" + "@nrwl/devkit" "^15.0.0" "@parcel/watcher@2.0.4": version "2.0.4" @@ -4677,7 +4678,7 @@ acorn-jsx@^5.3.2: resolved "https://registry.yarnpkg.com/acorn-jsx/-/acorn-jsx-5.3.2.tgz#7ed5bb55908b3b2f1bc55c6af1653bada7f07937" integrity sha512-rq9s+JNhf0IChjtDXxllJ7g41oZk5SlXtp0LHwyA5cejwn7vKmKp4pPri6YEePv2PU65sAsegbXtIinmDFDXgQ== -acorn-walk@^8.0.0, acorn-walk@^8.0.2, acorn-walk@^8.1.1: +acorn-walk@^8.0.0, acorn-walk@^8.0.2, acorn-walk@^8.1.1, acorn-walk@^8.2.0: version "8.2.0" resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.2.0.tgz#741210f2e2426454508853a2f44d0ab83b7f69c1" integrity sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA== @@ -16721,10 +16722,10 @@ tiny-warning@^1.0.0: resolved "https://registry.yarnpkg.com/tiny-warning/-/tiny-warning-1.0.3.tgz#94a30db453df4c643d0fd566060d60a875d84754" integrity sha512-lBN9zLN/oAf68o3zNXYrdCt1kP8WsiGW8Oo2ka41b2IM5JL/S1CTyX1rW0mb/zSuJun0ZUrDxx4sqvYS2FWzPA== -tinybench@^2.3.0: - version "2.3.0" - resolved "https://registry.yarnpkg.com/tinybench/-/tinybench-2.3.0.tgz#febb2e697c735c0cdb8eb1e43cb1d2fa1821f983" - integrity sha512-zs1gMVBwyyG2QbVchYIbnabRhMOCGvrwZz/q+SV+LIMa9q5YDQZi2kkI6ZRqV2Bz7ba1uvrc7ieUoE4KWnGeKg== +tinybench@^2.3.1: + version "2.3.1" + resolved "https://registry.yarnpkg.com/tinybench/-/tinybench-2.3.1.tgz#14f64e6b77d7ef0b1f6ab850c7a808c6760b414d" + integrity sha512-hGYWYBMPr7p4g5IarQE7XhlyWveh1EKhy4wUBS1LrHXCKYgvz+4/jCqgmJqZxxldesn05vccrtME2RLLZNW7iA== tinypool@^0.3.0: version "0.3.0" @@ -17642,7 +17643,7 @@ vfile@^5.0.0, vfile@^5.3.2: unist-util-stringify-position "^3.0.0" vfile-message "^3.0.0" -vite@^3.0.0, vite@^3.1.7: +vite@^3.0.0: version "3.1.7" resolved "https://registry.yarnpkg.com/vite/-/vite-3.1.7.tgz#9fc2b57a395f79175d38fa3cffd15080b0d9cbfc" integrity sha512-5vCAmU4S8lyVdFCInu9M54f/g8qbOMakVw5xJ4pjoaDy5wgy9sLLZkGdSLN52dlsBqh0tBqxjaqqa8LgPqwRAA== @@ -17654,6 +17655,18 @@ vite@^3.0.0, vite@^3.1.7: optionalDependencies: fsevents "~2.3.2" +vite@^3.2.3: + version "3.2.5" + resolved "https://registry.yarnpkg.com/vite/-/vite-3.2.5.tgz#dee5678172a8a0ab3e547ad4148c3d547f90e86a" + integrity sha512-4mVEpXpSOgrssFZAOmGIr85wPHKvaDAcXqxVxVRZhljkJOMZi1ibLibzjLHzJvcok8BMguLc7g1W6W/GqZbLdQ== + dependencies: + esbuild "^0.15.9" + postcss "^8.4.18" + resolve "^1.22.1" + rollup "^2.79.1" + optionalDependencies: + fsevents "~2.3.2" + vite@~3.2.4: version "3.2.4" resolved "https://registry.yarnpkg.com/vite/-/vite-3.2.4.tgz#d8c7892dd4268064e04fffbe7d866207dd24166e" @@ -17671,19 +17684,22 @@ vitefu@^0.2.1: resolved "https://registry.yarnpkg.com/vitefu/-/vitefu-0.2.2.tgz#d03215f351a1fd65f6c277d546f2d30956b970f9" integrity sha512-8CKEIWPm4B4DUDN+h+hVJa9pyNi7rzc5MYmbxhs1wcMakueGFNWB5/DL30USm9qU3xUPnL4/rrLEAwwFiD1tag== -vitest@^0.24.1: - version "0.24.1" - resolved "https://registry.yarnpkg.com/vitest/-/vitest-0.24.1.tgz#4b4ceb3d9c6710e8fb7a3b936b740f9c9f9cde10" - integrity sha512-NKkK1xnDIOOr42pKBfGQQl6b6IWdFVBpG6ZS1T+nUlJuqcOiZ7lxjVwHy9wrtTYpJ0BWww9y6bSGYXubD29Nag== +vitest@^0.25.1: + version "0.25.3" + resolved "https://registry.yarnpkg.com/vitest/-/vitest-0.25.3.tgz#4e5ed481e4da6a0ce014bdb71dfc9661fd62b722" + integrity sha512-/UzHfXIKsELZhL7OaM2xFlRF8HRZgAHtPctacvNK8H4vOcbJJAMEgbWNGSAK7Y9b1NBe5SeM7VTuz2RsTHFJJA== dependencies: "@types/chai" "^4.3.3" "@types/chai-subset" "^1.3.3" "@types/node" "*" + acorn "^8.8.0" + acorn-walk "^8.2.0" chai "^4.3.6" debug "^4.3.4" local-pkg "^0.4.2" + source-map "^0.6.1" strip-literal "^0.4.2" - tinybench "^2.3.0" + tinybench "^2.3.1" tinypool "^0.3.0" tinyspy "^1.0.2" vite "^3.0.0"