feat: add Angular Vite plugin and setup initial app

analogjs · Jul 6, 2022 · 6c9a98c · 6c9a98c
1 parent a7bd6be
commit 6c9a98c
Show file tree

Hide file tree

Showing 19 changed files with 573 additions and 61 deletions.
diff --git a/angular.json b/angular.json
@@ -3,6 +3,7 @@
   "version": 2,
   "projects": {
     "analog-app": "apps/analog-app",
-    "analog-app-e2e": "apps/analog-app-e2e"
+    "analog-app-e2e": "apps/analog-app-e2e",
+    "vite-plugin-angular": "libs/vite-plugin-angular"
   }
 }
diff --git a/apps/analog-app/project.json b/apps/analog-app/project.json
@@ -4,65 +4,20 @@
   "prefix": "analogjs",
   "targets": {
     "build": {
-      "executor": "@angular-devkit/build-angular:browser",
+      "executor": "nx:run-commands",
       "outputs": ["{options.outputPath}"],
       "options": {
-        "outputPath": "dist/apps/analog-app",
-        "index": "apps/analog-app/src/index.html",
-        "main": "apps/analog-app/src/main.ts",
-        "polyfills": "apps/analog-app/src/polyfills.ts",
-        "tsConfig": "apps/analog-app/tsconfig.app.json",
-        "assets": [
-          "apps/analog-app/src/favicon.ico",
-          "apps/analog-app/src/assets"
-        ],
-        "styles": ["apps/analog-app/src/styles.css"],
-        "scripts": []
-      },
-      "configurations": {
-        "production": {
-          "budgets": [
-            {
-              "type": "initial",
-              "maximumWarning": "500kb",
-              "maximumError": "1mb"
-            },
-            {
-              "type": "anyComponentStyle",
-              "maximumWarning": "2kb",
-              "maximumError": "4kb"
-            }
-          ],
-          "fileReplacements": [
-            {
-              "replace": "apps/analog-app/src/environments/environment.ts",
-              "with": "apps/analog-app/src/environments/environment.prod.ts"
-            }
-          ],
-          "outputHashing": "all"
-        },
-        "development": {
-          "buildOptimizer": false,
-          "optimization": false,
-          "vendorChunk": true,
-          "extractLicenses": false,
-          "sourceMap": true,
-          "namedChunks": true
-        }
-      },
-      "defaultConfiguration": "production"
+        "outputPath": "../../dist/apps/analog-app",
+        "command": "vite build",
+        "cwd": "apps/analog-app"
+      }
     },
     "serve": {
-      "executor": "@angular-devkit/build-angular:dev-server",
-      "configurations": {
-        "production": {
-          "browserTarget": "analog-app:build:production"
-        },
-        "development": {
-          "browserTarget": "analog-app:build:development"
-        }
-      },
-      "defaultConfiguration": "development"
+      "executor": "nx:run-commands",
+      "options": {
+        "cwd": "apps/analog-app",
+        "command": "vite"
+      }
     },
     "extract-i18n": {
       "executor": "@angular-devkit/build-angular:extract-i18n",

diff --git a/apps/analog-app/src/index.html b/apps/analog-app/src/index.html
@@ -9,5 +9,6 @@
   </head>
   <body>
     <analogjs-root></analogjs-root>
+    <script type="module" src="/main.ts"></script>
   </body>
 </html>
diff --git a/apps/analog-app/src/main.ts b/apps/analog-app/src/main.ts
@@ -1,3 +1,4 @@
+import './polyfills';
 import { enableProdMode } from '@angular/core';
 import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 

diff --git a/apps/analog-app/vite.config.ts b/apps/analog-app/vite.config.ts
@@ -0,0 +1,16 @@
+import { defineConfig } from 'vite';
+import angular from '../../dist/libs/vite-plugin-angular';
+
+// https://vitejs.dev/config/
+export default defineConfig({
+  root: 'src',
+  build: {
+    outDir: '../../dist/analog-app',
+    emptyOutDir: true
+  },
+  resolve: {
+    mainFields: ['module'],
+  },
+
+  plugins: [angular()],
+});
diff --git a/libs/vite-plugin-angular/.eslintrc.json b/libs/vite-plugin-angular/.eslintrc.json
@@ -0,0 +1,18 @@
+{
+  "extends": ["../../.eslintrc.json"],
+  "ignorePatterns": ["!**/*"],
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx", "*.js", "*.jsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {}
+    },
+    {
+      "files": ["*.js", "*.jsx"],
+      "rules": {}
+    }
+  ]
+}
diff --git a/libs/vite-plugin-angular/README.md b/libs/vite-plugin-angular/README.md
@@ -0,0 +1,11 @@
+# vite-plugin-angular
+
+This library was generated with [Nx](https://nx.dev).
+
+## Building
+
+Run `nx build vite-plugin-angular` to build the library.
+
+## Running unit tests
+
+Run `nx test vite-plugin-angular` to execute the unit tests via [Jest](https://jestjs.io).
diff --git a/libs/vite-plugin-angular/jest.config.ts b/libs/vite-plugin-angular/jest.config.ts
@@ -0,0 +1,15 @@
+/* eslint-disable */
+export default {
+  displayName: 'vite-plugin-angular',
+  preset: '../../jest.preset.js',
+  globals: {
+    'ts-jest': {
+      tsconfig: '<rootDir>/tsconfig.spec.json',
+    },
+  },
+  transform: {
+    '^.+\\.[tj]s$': 'ts-jest',
+  },
+  moduleFileExtensions: ['ts', 'js', 'html'],
+  coverageDirectory: '../../coverage/libs/vite-plugin-angular',
+};
diff --git a/libs/vite-plugin-angular/package.json b/libs/vite-plugin-angular/package.json
@@ -0,0 +1,5 @@
+{
+  "name": "@analogjs/vite-plugin-angular",
+  "version": "0.0.1",
+  "type": "commonjs"
+}
diff --git a/libs/vite-plugin-angular/project.json b/libs/vite-plugin-angular/project.json
@@ -0,0 +1,33 @@
+{
+  "$schema": "../../node_modules/nx/schemas/project-schema.json",
+  "sourceRoot": "libs/vite-plugin-angular/src",
+  "projectType": "library",
+  "targets": {
+    "build": {
+      "executor": "@nrwl/js:tsc",
+      "outputs": ["{options.outputPath}"],
+      "options": {
+        "outputPath": "dist/libs/vite-plugin-angular",
+        "main": "libs/vite-plugin-angular/src/index.ts",
+        "tsConfig": "libs/vite-plugin-angular/tsconfig.lib.json",
+        "assets": ["libs/vite-plugin-angular/*.md"]
+      }
+    },
+    "lint": {
+      "executor": "@nrwl/linter:eslint",
+      "outputs": ["{options.outputFile}"],
+      "options": {
+        "lintFilePatterns": ["libs/vite-plugin-angular/**/*.ts"]
+      }
+    },
+    "test": {
+      "executor": "@nrwl/jest:jest",
+      "outputs": ["coverage/libs/vite-plugin-angular"],
+      "options": {
+        "jestConfig": "libs/vite-plugin-angular/jest.config.ts",
+        "passWithNoTests": true
+      }
+    }
+  },
+  "tags": []
+}
diff --git a/libs/vite-plugin-angular/src/index.ts b/libs/vite-plugin-angular/src/index.ts
@@ -0,0 +1,3 @@
+import { angular } from './lib/angular-vite-plugin';
+
+export default angular;
diff --git a/libs/vite-plugin-angular/src/lib/angular-vite-plugin.spec.ts b/libs/vite-plugin-angular/src/lib/angular-vite-plugin.spec.ts
@@ -0,0 +1,7 @@
+import { angularVitePlugin } from './angular-vite-plugin';
+
+describe('angularVitePlugin', () => {
+  it('should work', () => {
+    expect(angularVitePlugin()).toEqual('angular-vite-plugin');
+  });
+});
-Original file line number
+Diff line change
@@ Expand Up / @@ -9,5 +9,6 @@ @@
       </head>
       <body>
         <analogjs-root></analogjs-root>
+        <script type="module" src="/main.ts"></script>
       </body>
     </html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import { angular } from './lib/angular-vite-plugin';

		export default angular;