feat: SwcFileChangeToLogMessage vite-plugin-node #46

.vscode/settings.json

@@ -1,11 +1,12 @@
 {
-    "typescript.tsdk": "node_modules/typescript/lib",
-    "editor.formatOnSave": true,
-    "eslint.format.enable": true,
-    "editor.defaultFormatter": "dbaeumer.vscode-eslint",
-    "typescript.format.enable": false,
-    "javascript.format.enable": false,
-    "[typescript]": {
-        "editor.defaultFormatter": "dbaeumer.vscode-eslint"
-    }
+  "typescript.tsdk": "node_modules/typescript/lib",
+  "editor.formatOnSave": true,
+  "eslint.format.enable": true,
+  "editor.defaultFormatter": "dbaeumer.vscode-eslint",
+  "typescript.format.enable": false,
+  "javascript.format.enable": false,
+  "[typescript]": {
+    "editor.defaultFormatter": "rvest.vs-code-prettier-eslint"
+  },
+  "nuxt.isNuxtApp": false
 }

examples/nest/src/app.service.ts

@@ -4,6 +4,6 @@ import { str } from './str';
 @Injectable()
 export class AppService {
   getHello(): string {
-    return `change me to see updates! ${str} from a new file,..`;
+    return `change To see updates! ${str} from a new file,..`;
   }
 }

examples/nest/src/vite-env.d.ts

@@ -0,0 +1 @@
+/// <reference types="vite/client" />

examples/nest/tsconfig.json

@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
-    "module": "commonjs",
+    "module": "ESNext",
+    "moduleResolution": "node",
     "declaration": true,
     "removeComments": true,
     "emitDecoratorMetadata": true,

packages/vite-plugin-node/package.json

@@ -34,6 +34,7 @@
   "dependencies": {
     "@rollup/pluginutils": "^4.1.1",
     "chalk": "^4.1.2",
+    "colors": "^1.4.0",
     "debug": "^4.3.2"
   },
   "peerDependencies": {

packages/vite-plugin-node/src/rollup-plugin-swc.ts

@@ -1,9 +1,9 @@
 import { createFilter } from '@rollup/pluginutils';
 import type { Compiler, Options } from '@swc/core';
 import type { Plugin } from 'vite';
-import { cleanUrl } from './utils';
+import { SwcFileUpdate, cleanUrl } from './utils';
 
-export function RollupPluginSwc(options: Options): Plugin {
+export function RollupPluginSwc(options: Options, appPath: string): Plugin {
   let swc: Compiler;
   // todo: load swc/tsconfig from config files
   const config: Options = {
@@ -19,7 +19,7 @@ export function RollupPluginSwc(options: Options): Plugin {
       if (filter(id) || filter(cleanUrl(id))) {
         if (!swc)
           swc = await import('@swc/core');
-
+        SwcFileUpdate(id, appPath);
         const result = await swc.transform(code, {
           ...config,
           filename: id,

packages/vite-plugin-node/src/utils.ts

@@ -1,3 +1,6 @@
+import path from 'path';
+import 'colors';
+
 /**
  * modified from vitejs source code, just to make the console output looks vite-like
  */
@@ -16,7 +19,7 @@ export const cleanUrl = (url: string) =>
   url.replace(hashRE, '').replace(queryRE, '');
 
 export function isObject(item: any): item is object {
-  return (item && typeof item === 'object' && !Array.isArray(item));
+  return item && typeof item === 'object' && !Array.isArray(item);
 }
 
 export default function mergeDeep(target: object, source: object) {
@@ -40,3 +43,26 @@ export default function mergeDeep(target: object, source: object) {
   }
   return output;
 }
+const CacheFileMap: Record<string, number> = {};
+
+export function SwcFileUpdate(FileId: string, appPath: string) {
+  console.clear();
+
+  let rootPath = '';
+  FileId.split(path.sep).forEach((spath) => {
+    appPath.split('/').forEach((apath) => {
+      if (apath === spath && rootPath === '')
+        rootPath = apath;
+    });
+  });
+
+  const FileNameIndex = FileId.split(path.sep).indexOf(rootPath);
+  const FilePath = path.join(...FileId.split(path.sep).slice(FileNameIndex));
+  if (CacheFileMap[FilePath] === undefined)
+    CacheFileMap[FilePath] = 0;
+  else CacheFileMap[FilePath] += 1;
+
+  CacheFileMap[FilePath] !== 0
+    /* eslint-disable no-console */
+    && console.log(`${FilePath} ✖️ [ ${CacheFileMap[FilePath]} ] updated`.yellow);
+}

packages/vite-plugin-node/src/vite-plugin-node.ts

@@ -6,22 +6,25 @@ import { PLUGIN_NAME } from '.';
 import type { VitePluginNodeConfig } from '.';
 
 export function VitePluginNode(cfg: VitePluginNodeConfig): Plugin[] {
-  const swcOptions = mergeDeep({
-    module: {
-      type: 'es6',
-    },
-    jsc: {
-      target: 'es2019',
-      parser: {
-        syntax: 'typescript',
-        decorators: true,
+  const swcOptions = mergeDeep(
+    {
+      module: {
+        type: 'es6',
       },
-      transform: {
-        legacyDecorator: true,
-        decoratorMetadata: true,
+      jsc: {
+        target: 'es2019',
+        parser: {
+          syntax: 'typescript',
+          decorators: true,
+        },
+        transform: {
+          legacyDecorator: true,
+          decoratorMetadata: true,
+        },
       },
     },
-  }, cfg.swcOptions ?? {});
+    cfg.swcOptions ?? {},
+  );
 
   const config: VitePluginNodeConfig = {
     appPath: cfg.appPath,
@@ -36,7 +39,9 @@ export function VitePluginNode(cfg: VitePluginNodeConfig): Plugin[] {
     {
       name: PLUGIN_NAME,
       config: () => {
-        const plugincConfig: UserConfig & { VitePluginNodeConfig: VitePluginNodeConfig } = {
+        const plugincConfig: UserConfig & {
+          VitePluginNodeConfig: VitePluginNodeConfig
+        } = {
           build: {
             ssr: config.appPath,
             rollupOptions: {
@@ -49,9 +54,7 @@ export function VitePluginNode(cfg: VitePluginNodeConfig): Plugin[] {
           optimizeDeps: {
             // Vite does not work well with optionnal dependencies,
             // mark them as ignored for now
-            exclude: [
-              '@swc/core',
-            ],
+            exclude: ['@swc/core'],
           },
           VitePluginNodeConfig: config,
         };
@@ -69,7 +72,7 @@ export function VitePluginNode(cfg: VitePluginNodeConfig): Plugin[] {
 
   if (config.tsCompiler === 'swc') {
     plugins.push({
-      ...RollupPluginSwc(config.swcOptions!),
+      ...RollupPluginSwc(config.swcOptions!, cfg.appPath),
     });
   }