@nocobase/cli 2.1.0-alpha.10 → 2.1.0-alpha.11

package/nocobase.conf.tpl

@@ -50,6 +50,14 @@ server {
             allow all;
         }
 
+        location ~ ^/static/plugins/@([^/]+)/([^/]+)/dist/client-v2/(.*)$ {
+            allow all;
+        }
+
+        location ~ ^/static/plugins/([^/]+)/dist/client-v2/(.*)$ {
+            allow all;
+        }
+
         location ~ ^/static/plugins/(.*)$ {
             deny all;
         }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/cli",
-  "version": "2.1.0-alpha.10",
+  "version": "2.1.0-alpha.11",
   "description": "",
   "license": "Apache-2.0",
   "main": "./src/index.js",
@@ -8,7 +8,7 @@
     "nocobase": "./bin/index.js"
   },
   "dependencies": {
-    "@nocobase/app": "2.1.0-alpha.10",
+    "@nocobase/app": "2.1.0-alpha.11",
     "@nocobase/license-kit": "^0.3.8",
     "@types/fs-extra": "^11.0.1",
     "@umijs/utils": "3.5.20",
@@ -27,12 +27,12 @@
     "tsx": "^4.19.0"
   },
   "devDependencies": {
-    "@nocobase/devtools": "2.1.0-alpha.10"
+    "@nocobase/devtools": "2.1.0-alpha.11"
   },
   "repository": {
     "type": "git",
     "url": "git+https://github.com/nocobase/nocobase.git",
     "directory": "packages/core/cli"
   },
-  "gitHead": "ce790d46c0a5768ca9618c7d0d77ab8300de75c8"
+  "gitHead": "bb96d633a6371afb586072ff516bd0613c757db0"
 }

package/src/commands/client.js

@@ -41,12 +41,14 @@ async function copyPluginClients(pluginsBaseDir, namespace, target) {
     const pluginNames = await fs.readdir(pluginsDir);
     for (const pluginName of pluginNames) {
       const pluginPath = resolve(pluginsDir, pluginName);
-      const pluginDistClient = resolve(pluginPath, 'dist/client');
-      if (await fs.exists(pluginDistClient)) {
-        const pluginTarget = resolve(target, 'static/plugins', namespace, pluginName, 'dist/client');
-        await fs.mkdir(resolve(pluginTarget, '..'), { recursive: true });
-        await fs.copy(pluginDistClient, pluginTarget, { recursive: true });
-        console.log(chalk.green(`Copied ${namespace}/${pluginName} client files`));
+      for (const lane of ['client', 'client-v2']) {
+        const pluginDistClient = resolve(pluginPath, `dist/${lane}`);
+        if (await fs.exists(pluginDistClient)) {
+          const pluginTarget = resolve(target, 'static/plugins', namespace, pluginName, 'dist', lane);
+          await fs.mkdir(resolve(pluginTarget, '..'), { recursive: true });
+          await fs.copy(pluginDistClient, pluginTarget, { recursive: true });
+          console.log(chalk.green(`Copied ${namespace}/${pluginName} ${lane} files`));
+        }
       }
     }
   }

package/src/commands/dev.js

@@ -8,7 +8,17 @@
  */
 const _ = require('lodash');
 const { Command } = require('commander');
-const { generatePlugins, run, postCheck, nodeCheck, promptForTs, isPortReachable, checkDBDialect } = require('../util');
+const {
+  generatePlugins,
+  run,
+  runWithPrefix,
+  postCheck,
+  nodeCheck,
+  promptForTs,
+  isPortReachable,
+  buildWSURL,
+  checkDBDialect,
+} = require('../util');
 const { getPortPromise } = require('portfinder');
 const chokidar = require('chokidar');
 const { uid } = require('@formily/shared');
@@ -42,6 +52,7 @@ module.exports = (cli) => {
     .option('-c, --client')
     .option('-s, --server')
     .option('--db-sync')
+    .option('--rsbuild')
     .option('--client-v2-only')
     .option('-i, --inspect [port]')
     .allowUnknownOption()
@@ -65,7 +76,7 @@ module.exports = (cli) => {
         return;
       }
 
-      const { port, client, server, inspect, clientV2Only } = opts;
+      const { port, client, server, inspect, clientV2Only, rsbuild } = opts;
 
       if (port) {
         process.env.APP_PORT = opts.port;
@@ -83,6 +94,7 @@ module.exports = (cli) => {
       const shouldRunClientV2 = clientV2Only || client || !server;
       const shouldRunClient = !clientV2Only && (client || !server);
       const shouldRunServer = !clientV2Only && (server || !client);
+      const shouldRunClientWithRsbuild = shouldRunClient && !!rsbuild;
 
       if (shouldRunServer && server) {
         serverPort = APP_PORT;
@@ -98,27 +110,35 @@ module.exports = (cli) => {
         });
       }
 
+      let subprocessClient;
+      let subprocessClientV2;
+
       const runDevClientV2 = () => {
         console.log('starting client-v2', 1 * clientV2Port);
-        run('rsbuild', ['dev', '--config', `${APP_PACKAGE_ROOT}/client-v2/rsbuild.config.ts`], {
-          env: {
-            ...process.env,
-            APP_V2_PORT: `${clientV2Port}`,
-            NODE_ENV: 'development',
-            RSPACK_HMR_CLIENT_PORT: `${clientV2Only ? clientV2Port : clientPort}`,
-            API_BASE_URL: process.env.API_BASE_URL || process.env.API_BASE_PATH,
-            API_CLIENT_STORAGE_PREFIX: process.env.API_CLIENT_STORAGE_PREFIX,
-            API_CLIENT_STORAGE_TYPE: process.env.API_CLIENT_STORAGE_TYPE,
-            API_CLIENT_SHARE_TOKEN: process.env.API_CLIENT_SHARE_TOKEN || 'false',
-            WEBSOCKET_URL:
-              process.env.WEBSOCKET_URL || (serverPort ? `ws://localhost:${serverPort}${process.env.WS_PATH}` : ''),
-            WS_PATH: process.env.WS_PATH,
-            ESM_CDN_BASE_URL: process.env.ESM_CDN_BASE_URL || 'https://esm.sh',
-            ESM_CDN_SUFFIX: process.env.ESM_CDN_SUFFIX || '',
-            PROXY_TARGET_URL:
-              process.env.PROXY_TARGET_URL || (serverPort ? `http://127.0.0.1:${serverPort}` : undefined),
+        subprocessClientV2 = runWithPrefix(
+          'rsbuild',
+          ['dev', '--config', `${APP_PACKAGE_ROOT}/client-v2/rsbuild.config.ts`],
+          {
+            prefix: 'client-v2',
+            color: 'magenta',
+            env: {
+              ...process.env,
+              APP_V2_PORT: `${clientV2Port}`,
+              NODE_ENV: 'development',
+              RSPACK_HMR_CLIENT_PORT: `${clientV2Only ? clientV2Port : clientPort}`,
+              API_BASE_URL: process.env.API_BASE_URL || process.env.API_BASE_PATH,
+              API_CLIENT_STORAGE_PREFIX: process.env.API_CLIENT_STORAGE_PREFIX,
+              API_CLIENT_STORAGE_TYPE: process.env.API_CLIENT_STORAGE_TYPE,
+              API_CLIENT_SHARE_TOKEN: process.env.API_CLIENT_SHARE_TOKEN || 'false',
+              WEBSOCKET_URL: process.env.WEBSOCKET_URL || buildWSURL(process.env.API_BASE_URL, serverPort),
+              WS_PATH: process.env.WS_PATH,
+              ESM_CDN_BASE_URL: process.env.ESM_CDN_BASE_URL || 'https://esm.sh',
+              ESM_CDN_SUFFIX: process.env.ESM_CDN_SUFFIX || '',
+              PROXY_TARGET_URL:
+                process.env.PROXY_TARGET_URL || (serverPort ? `http://127.0.0.1:${serverPort}` : undefined),
+            },
           },
-        });
+        );
       };
 
       if (clientV2Only) {
@@ -126,28 +146,60 @@ module.exports = (cli) => {
         return;
       }
 
-      let subprocess;
       const runDevClient = () => {
         console.log('starting client', 1 * clientPort);
-        subprocess = run('umi', ['dev'], {
+        const command = shouldRunClientWithRsbuild ? 'rsbuild' : 'umi';
+        const args = shouldRunClientWithRsbuild
+          ? ['dev', '--config', `${APP_PACKAGE_ROOT}/client/rsbuild.config.ts`]
+          : ['dev'];
+        subprocessClient = runWithPrefix(command, args, {
+          prefix: 'client',
+          color: 'cyan',
           env: {
             ...process.env,
             stdio: 'inherit',
             shell: true,
             PORT: clientPort,
+            APP_PORT: `${clientPort}`,
             APP_ROOT: `${APP_PACKAGE_ROOT}/client`,
             APP_V2_PORT: `${clientV2Port}`,
-            WEBSOCKET_URL:
-              process.env.WEBSOCKET_URL ||
-              (serverPort ? `ws://localhost:${serverPort}${process.env.WS_PATH}` : undefined),
+            NODE_ENV: 'development',
+            RSPACK_HMR_CLIENT_PORT: `${clientPort}`,
+            API_BASE_URL: process.env.API_BASE_URL || process.env.API_BASE_PATH,
+            API_CLIENT_STORAGE_PREFIX: process.env.API_CLIENT_STORAGE_PREFIX,
+            API_CLIENT_STORAGE_TYPE: process.env.API_CLIENT_STORAGE_TYPE,
+            API_CLIENT_SHARE_TOKEN: process.env.API_CLIENT_SHARE_TOKEN || 'false',
+            WEBSOCKET_URL: process.env.WEBSOCKET_URL || buildWSURL(process.env.API_BASE_URL, serverPort),
             PROXY_TARGET_URL:
               process.env.PROXY_TARGET_URL || (serverPort ? `http://127.0.0.1:${serverPort}` : undefined),
           },
         });
       };
 
+      const restartSubprocess = async (subprocessRef, port, start) => {
+        if (!subprocessRef) {
+          start();
+          return;
+        }
+        subprocessRef.cancel();
+        let i = 0;
+        while (true) {
+          ++i;
+          const result = await isPortReachable(port);
+          if (!result) {
+            break;
+          }
+          await sleep(500);
+          if (i > 10) {
+            break;
+          }
+        }
+        start();
+      };
+
       if (shouldRunClient) {
-        const watcher = chokidar.watch('./storage/plugins/**/*', {
+        const storagePluginPath = path.resolve(process.cwd(), 'storage/plugins');
+        const watcher = chokidar.watch(`${storagePluginPath}/**/*`, {
           cwd: process.cwd(),
           ignored: /(^|[\/\\])\../, // 忽略隐藏文件
           persistent: true,
@@ -160,28 +212,18 @@ module.exports = (cli) => {
         const restartClient = _.debounce(async () => {
           if (!isReady) return;
           generatePlugins();
-          if (subprocess) {
-            console.log('client restarting...');
-            subprocess.cancel();
-            let i = 0;
-            while (true) {
-              ++i;
-              const result = await isPortReachable(clientPort);
-              if (!result) {
-                break;
-              }
-              await sleep(500);
-              if (i > 10) {
-                break;
-              }
-            }
-            runDevClient();
-            await fs.promises.writeFile(process.env.WATCH_FILE, `export const watchId = '${uid()}';`, 'utf-8');
+          if (shouldRunClient) {
+            await restartSubprocess(subprocessClient, clientPort, runDevClient);
+          }
+          if (shouldRunClientV2) {
+            await restartSubprocess(subprocessClientV2, clientV2Port, runDevClientV2);
           }
+          await fs.promises.writeFile(process.env.WATCH_FILE, `export const watchId = '${uid()}';`, 'utf-8');
         }, 500);
 
         watcher
           .on('ready', () => {
+            console.log('watching plugin folder changes...');
             isReady = true;
           })
           .on('addDir', async () => {

package/src/util.js

@@ -83,6 +83,44 @@ exports.run = (command, args, options = {}) => {
   });
 };
 
+exports.runWithPrefix = (command, args, options = {}) => {
+  if (command === 'tsx') {
+    command = 'node';
+    args = ['./node_modules/tsx/dist/cli.mjs'].concat(args || []);
+  }
+
+  const prefix = options.prefix || 'process';
+  const color = options.color || 'cyan';
+  const label = chalk[color](`[${prefix}]`);
+  const subprocess = execa(command, args, {
+    shell: true,
+    stdio: 'pipe',
+    ...options,
+    env: {
+      ...process.env,
+      ...options.env,
+    },
+  });
+
+  const writePrefixed = (chunk, writer) => {
+    const text = chunk.toString();
+    const lines = text.split(/\r?\n/);
+    const trailingNewline = text.endsWith('\n') || text.endsWith('\r');
+
+    lines.forEach((line, index) => {
+      if (!line && index === lines.length - 1 && trailingNewline) {
+        return;
+      }
+      writer.write(`${label} ${line}\n`);
+    });
+  };
+
+  subprocess.stdout?.on('data', (chunk) => writePrefixed(chunk, process.stdout));
+  subprocess.stderr?.on('data', (chunk) => writePrefixed(chunk, process.stderr));
+
+  return subprocess;
+};
+
 exports.isPortReachable = async (port, { timeout = 1000, host } = {}) => {
   const promise = new Promise((resolve, reject) => {
     const socket = new net.Socket();
@@ -232,6 +270,7 @@ exports.genTsConfigPaths = function genTsConfigPaths() {
       .split(sep)
       .join('/');
     paths[`${packageJsonName}/client`] = [`${relativePath}/src/client`];
+    paths[`${packageJsonName}/client-v2`] = [`${relativePath}/src/client-v2`];
     paths[`${packageJsonName}/package.json`] = [`${relativePath}/package.json`];
     paths[packageJsonName] = [`${relativePath}/src`];
     if (packageJsonName === '@nocobase/test') {
@@ -523,10 +562,40 @@ exports.checkDBDialect = function () {
 
 exports.generatePlugins = function () {
   try {
-    require.resolve('@nocobase/devtools/umiConfig');
-    const { generatePlugins } = require('@nocobase/devtools/umiConfig');
-    generatePlugins();
+    require.resolve('@nocobase/devtools/common');
+    const { generateAllPlugins, generatePlugins, generateV2Plugins } = require('@nocobase/devtools/common');
+    if (typeof generateAllPlugins === 'function') {
+      generateAllPlugins();
+      return;
+    }
+    generatePlugins?.();
+    generateV2Plugins?.();
   } catch (error) {
     return;
   }
 };
+
+exports.isURL = function isURL(str) {
+  let url;
+
+  try {
+    url = new URL(str);
+  } catch (e) {
+    return false;
+  }
+
+  return url.protocol === 'http:' || url.protocol === 'https:';
+};
+
+exports.buildWSURL = function buildWSURL(urlString, serverPort) {
+  if (exports.isURL(urlString)) {
+    const parsedUrl = new URL(urlString);
+    parsedUrl.protocol = parsedUrl.protocol === 'https:' ? 'wss:' : 'ws:';
+    parsedUrl.pathname =
+      process.env.WS_PATH || (process.env.APP_PUBLIC_PATH ? process.env.APP_PUBLIC_PATH + 'ws' : '/ws');
+    const url = parsedUrl.toString();
+    return url;
+  }
+
+  return serverPort ? `ws://localhost:${serverPort}${process.env.WS_PATH}` : undefined;
+};

package/templates/plugin/client-v2.d.ts

@@ -0,0 +1,2 @@
+export * from './dist/client-v2';
+export { default } from './dist/client-v2';

package/templates/plugin/client-v2.js

@@ -0,0 +1 @@
+module.exports = require('./dist/client-v2/index.js');

package/templates/plugin/package.json.tpl

@@ -5,6 +5,7 @@
   "dependencies": {},
   "peerDependencies": {
     "@nocobase/client": "2.x",
+    "@nocobase/client-v2": "2.x",
     "@nocobase/server": "2.x",
     "@nocobase/test": "2.x"
   }

package/templates/plugin/src/client-v2/client.d.ts

@@ -0,0 +1,103 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * For more information, please refer to: https://www.nocobase.com/agreement.
+ */
+
+// CSS modules
+type CSSModuleClasses = { readonly [key: string]: string };
+
+declare module '*.module.css' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+declare module '*.module.scss' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+declare module '*.module.sass' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+declare module '*.module.less' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+declare module '*.module.styl' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+declare module '*.module.stylus' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+declare module '*.module.pcss' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+declare module '*.module.sss' {
+  const classes: CSSModuleClasses;
+  export default classes;
+}
+
+// CSS
+declare module '*.css' {}
+declare module '*.scss' {}
+declare module '*.sass' {}
+declare module '*.less' {}
+declare module '*.styl' {}
+declare module '*.stylus' {}
+declare module '*.pcss' {}
+declare module '*.sss' {}
+
+declare module '*.apng' {
+  const src: string;
+  export default src;
+}
+declare module '*.png' {
+  const src: string;
+  export default src;
+}
+declare module '*.jpg' {
+  const src: string;
+  export default src;
+}
+declare module '*.jpeg' {
+  const src: string;
+  export default src;
+}
+declare module '*.jfif' {
+  const src: string;
+  export default src;
+}
+declare module '*.pjpeg' {
+  const src: string;
+  export default src;
+}
+declare module '*.pjp' {
+  const src: string;
+  export default src;
+}
+declare module '*.gif' {
+  const src: string;
+  export default src;
+}
+declare module '*.svg' {
+  const src: string;
+  export default src;
+}
+declare module '*.ico' {
+  const src: string;
+  export default src;
+}
+declare module '*.webp' {
+  const src: string;
+  export default src;
+}
+declare module '*.avif' {
+  const src: string;
+  export default src;
+}

package/templates/plugin/src/client-v2/index.tsx.tpl

@@ -0,0 +1 @@
+export { default } from './plugin';

package/templates/plugin/src/client-v2/plugin.tsx.tpl

@@ -0,0 +1,7 @@
+import { Plugin } from '@nocobase/client-v2';
+
+export class {{{pascalCaseName}}}ClientV2 extends Plugin {
+  async load() {}
+}
+
+export default {{{pascalCaseName}}}ClientV2;