@shijiu/jsview 2.3.151-test.0 → 3.0.0-next-vue.0

package/tools/jsview-post-install.mjs

@@ -8,6 +8,7 @@ import {
   checkNodeVersion,
   cpSync,
   execCommand,
+  getNodeVersion,
   getOptions,
   loadPackageObject,
   isSymlinkSync,
@@ -31,11 +32,10 @@ function checkNpmCommand()
   Logger.Warn('Please use "npm ci" to install node modules.');
 }
 
-function checkNpmLinkForDebug(options, linkablePkgNames)
+function checkNpmMissingDepPkgs(options, linkablePkgNames)
 {
   const pkgObj = loadPackageObject(options.projectDir);
 
-  // node 16 不会安装本地包的二次依赖, 需要手动安装。
   let missingDepPkgs = '';
   for (const linkableName of linkablePkgNames) {
     let linkableTarget = pkgObj.dependencies?.[linkableName];
@@ -69,11 +69,14 @@ function checkNpmLinkForDebug(options, linkablePkgNames)
     }
   }
   if (missingDepPkgs !== '') {
-    Logger.Info('Install missing dependencies')
     execCommand('npm install --force --no-save ' + missingDepPkgs);
   }
+}
+
+function checkNpmLinkableDepPkgs(options, linkablePkgNames)
+{
+  const pkgObj = loadPackageObject(options.projectDir);
 
-  // node 18 不会将本地依赖安装成链接，需要手动改成链接。
   for (const linkableName of linkablePkgNames) {
     let linkableTarget = pkgObj.dependencies?.[linkableName];
     if (!linkableTarget || !linkableTarget.startsWith('file:../../@shijiu/jsview')) {
@@ -89,43 +92,60 @@ function checkNpmLinkForDebug(options, linkablePkgNames)
     const linkablePath = path.resolve(options.modulesDir, linkableName);
     symlinkSync(options.projectDir, linkableTargetPath, linkablePath);
   }
-
 }
 
-function checkPatches(options, pkgNeedPatch, skipCheckVersion)
+function checkNpmLinkForDebug(options, linkablePkgNames)
 {
-  Logger.Info('Checking package:');
-  for (const pkgName of pkgNeedPatch) {
-    if (skipCheckVersion !== true) {
-      const patchPkgDir = path.resolve(options.jsviewPatchModulesDir, pkgName);
-      const patchPkgObj = loadPackageObject(patchPkgDir);
-      Logger.Info('  ' + pkgName + ': ' + patchPkgObj.version);
-
-      const modulePkgDir = path.resolve(options.modulesDir, pkgName);
-      const modulePkgObj = loadPackageObject(modulePkgDir);
-      if (modulePkgObj.version != patchPkgObj.version) {
-        Logger.ErrorAndExit(pkgName + '@' + modulePkgObj.version + ' is not supported, required version is ' + patchPkgObj.version);
-      }
-    } else {
-      Logger.Info('  Skip ', pkgName);
-    }
-  }
-}
+  const nodeVersion = getNodeVersion();
 
-function installPatches(options, pkgNeedPatch)
-{
-  Logger.Info('Stage 1: Installing patches for JsView:');
-  for (const pkgName of pkgNeedPatch) {
-    const patchSrc = path.resolve(options.jsviewPatchModulesDir, pkgName);
-    const patchDest = path.resolve(options.modulesDir, pkgName);
+  const pkgObj = loadPackageObject(options.projectDir);
 
-    cpSync(options.projectDir, patchSrc, patchDest, ['package.json']);
-  }
+  // node 不会安装本地包的二次依赖, 需要手动安装。
+  checkNpmMissingDepPkgs(options, linkablePkgNames);
 
-  Logger.Info('Cleanup node_modules cache... ');
-  rmSync(options.projectDir, options.cacheDir);
+  // node 18 不会将本地依赖安装成链接，需要手动改成链接。
+  if(nodeVersion.major == 18) {
+    checkNpmLinkableDepPkgs(options, linkablePkgNames);
+  }
 }
 
+// function checkPatches(options, pkgNeedInstallModules, skipCheckVersion)
+// {
+//   Logger.Info('Checking package:');
+//   for (const pkgName of pkgNeedInstallModules) {
+//     if (skipCheckVersion !== true) {
+//       const patchPkgDir = path.resolve(options.jsviewPatchInstallModulesDir, pkgName);
+//       const patchPkgObj = loadPackageObject(patchPkgDir);
+//       Logger.Info('  ' + pkgName + ': ' + patchPkgObj.version);
+
+//       const modulePkgDir = path.resolve(options.modulesDir, pkgName);
+//       const modulePkgObj = loadPackageObject(modulePkgDir);
+//       if (modulePkgObj.version != patchPkgObj.version) {
+//         Logger.ErrorAndExit(pkgName + '@' + modulePkgObj.version + ' is not supported, required version is ' + patchPkgObj.version);
+//       }
+//     } else {
+//       Logger.Info('  Skip ', pkgName);
+//     }
+//   }
+// }
+
+// function installPatches(options, pkgNeedInstallModules, skipCheckVersion)
+// {
+//   Logger.Info('Stage 2: Installing patches for JsView:');
+
+//   checkPatches(options, pkgNeedInstallModules, skipCheckVersion);
+
+//   for (const pkgName of pkgNeedInstallModules) {
+//     const patchSrc = path.resolve(options.jsviewPatchInstallModulesDir, pkgName);
+//     const patchDest = path.resolve(options.modulesDir, pkgName);
+
+//     cpSync(options.projectDir, patchSrc, patchDest, ['package.json']);
+//   }
+
+//   Logger.Info('Cleanup node_modules cache... ');
+//   rmSync(options.projectDir, options.cacheDir);
+// }
+
 function getPatchListRecursive(patchDir)
 {
   var patchList = [];
@@ -150,57 +170,23 @@ function getPatchListRecursive(patchDir)
   return patchList;
 }
 
-function autoPatchPackages(options)
+function autoPatchPackages(options, pkgNeedPatchModules)
 {
-  Logger.Info('Stage 2: Auto patching packages:');
-
   const patchCacheDir = path.resolve(options.cacheJsViewDir, 'patches');
   fs.mkdirSync(patchCacheDir, { recursive: true, force: true });
-
-  const patchInfo = {};
-  const patchList = getPatchListRecursive(options.jsviewPatchModulesDir);
-  for (const patchFullPath of patchList) {
-    const patchRelativePath = path.relative(options.jsviewPatchModulesDir, patchFullPath);
-    const patchNameAndVersion = path.dirname(patchRelativePath);
-    const patchVersion = path.basename(patchNameAndVersion);
-    const patchName = path.dirname(patchNameAndVersion);
-
-    if(!patchInfo[patchName]) {
-      patchInfo[patchName] = [];
-    }
-    patchInfo[patchName].push(patchVersion);
-  }
-
-  for(const [patchName, patchVersions] of Object.entries(patchInfo)) {
-    const pkgFullDir = path.resolve(options.modulesDir, patchName);
-    const pkgJsonFullPath = path.resolve(pkgFullDir, 'package.json');
-    if(fs.existsSync(pkgJsonFullPath) == false) {
-      continue;
-    }
-
-    const pkgObj = loadPackageObject(pkgFullDir);
-    const pkgVersion = pkgObj.version;
-    if(patchVersions.includes(pkgVersion) == false) {
-      Logger.Warn('  Patch file for ' + patchName + '@' + pkgVersion + ' is not found.');
+  for (const file of pkgNeedPatchModules) {
+    if(file.endsWith('.patch') == false) {
       continue;
     }
 
-    const patchFullDir = path.resolve(options.jsviewPatchModulesDir, patchName, pkgVersion);
-    const patchFiles = fs.readdirSync(patchFullDir);
-    for (const file of patchFiles) {
-      if(file.endsWith('.patch') == false) {
-        continue;
-      }
-
-      const copyFromPath = path.resolve(patchFullDir, file);
-      const copyToPath = path.resolve(patchCacheDir, file);
-      cpSync(options.projectDir, copyFromPath, copyToPath);
-    }
+    const copyFromPath = path.resolve(options.jsviewPatchesDir, file);
+    const copyToPath = path.resolve(patchCacheDir, file);
+    cpSync(options.projectDir, copyFromPath, copyToPath);
   }
 
   const hasPatches = fs.readdirSync(patchCacheDir);
   if(hasPatches && hasPatches.length > 0) {
-    execCommand('npx patch-package --patch-dir ' + path.relative(options.projectDir, patchCacheDir));
+    execCommand('npx patch-package --error-on-fail --patch-dir ' + path.relative(options.projectDir, patchCacheDir));
   } else {
     Logger.Info('  No patch files found.');
   }
@@ -230,10 +216,10 @@ async function printRevision(options)
           let versionFilePath = path.resolve(pathname, 'version.mjs'); 
           if (fs.existsSync(versionFilePath)) {
             const versionFileURL = url.pathToFileURL(versionFilePath);
-            const { default: targetVersion } = await import(versionFileURL);
-            Logger.Info(`*    [${path.basename
-              (pathname)}] : ${targetVersion.packageName
-              } : ${targetVersion.version}`);
+            const versionModule = await import(versionFileURL);
+            // 兼容 default 导出（JsvAudio/JsvPlayer）与命名导出 PluginInfo（JsvLatex）
+            const targetVersion = versionModule.PluginInfo ?? versionModule.default;
+            Logger.Info(`*    [${path.basename(pathname)}] : ${targetVersion.packageName} : ${targetVersion.version}`);
             pluginCount++;
           }
         }
@@ -260,22 +246,22 @@ function doPostInstall(framework, pkgNeedPatch, skipCheckVersion, skipCheckNpmcm
     '@shijiu/jsview-vue',
     '@shijiu/jsview-vue-samples',
     '@shijiu/jsview-vue-extra-samples',
-    '@shijiu/jsview-react',
-    '@shijiu/jsview-react-samples',
-    '@shijiu/jsview-react-extra-samples',
+    // '@shijiu/jsview-react',
+    // '@shijiu/jsview-react-samples',
+    // '@shijiu/jsview-react-extra-samples',
   ];
 
   if(!skipCheckNpmcmd) {
     checkNpmCommand();
   }
 
+  Logger.Tip('Stage 1: Check link and missing dependencies...')
   checkNpmLinkForDebug(options, linkablePkgNames);
 
-  checkPatches(options, pkgNeedPatch, skipCheckVersion);
+  Logger.Tip('Stage 2: Auto patching packages...');
+  autoPatchPackages(options, pkgNeedPatch.patchModules);
 
-  installPatches(options, pkgNeedPatch);
-
-  autoPatchPackages(options);
+  // installPatches(options, pkgNeedPatch.installModules, skipCheckVersion);
 
   printRevision(options);
 }
@@ -288,29 +274,45 @@ function main(argv)
 
   switch (argv.framework) {
     case 'vue':
-      pkgNeedPatch = [
-        '@vitejs/plugin-vue',
-        '@vue/compiler-dom',
-        '@vue/compiler-sfc',
-        '@vue/runtime-core',
-        '@vue/runtime-dom',
-        'postcss-js',
-        'vite',
-        'vue-router',
-      ];
-      break;
-    case 'react':
-      pkgNeedPatch = [
-        'react-dev-utils',
-        'react-dom',
-        'react-scripts',
-        'webpack-dev-server',
-      ];
+      pkgNeedPatch = {
+        installModules: [
+          // '@vitejs/plugin-vue',
+          // '@vue/compiler-dom',
+          // '@vue/compiler-sfc',
+          // '@vue/runtime-core',
+          // '@vue/runtime-dom',
+          // 'postcss-js',
+          'vite',
+          // 'vue-router',
+        ],
+        patchModules: [
+          '@vitejs+plugin-vue+6.0.6.patch',
+          '@vue+compiler-dom+3.6.0-beta.10.patch',
+          '@vue+compiler-sfc+3.6.0-beta.10.patch',
+          '@vue+runtime-core+3.6.0-beta.10.patch',
+          '@vue+runtime-dom+3.6.0-beta.10.patch',
+          'postcss-js+5.1.0.patch',
+          'vite+8.0.9.patch',
+          'vue-router+5.0.6.patch',
+        ]
+      };
       break;
+    // case 'react':
+    //   pkgNeedPatch = [
+    //     'react-dev-utils',
+    //     'react-dom',
+    //     'react-scripts',
+    //     'webpack-dev-server',
+    //   ];
+    //   break;
     default:
       Logger.ErrorAndExit('Failed to support framework: ' + framework);
   }
 
+  if(!argv.skipCheckVersion) {
+    argv.skipCheckVersion = true;
+  }
+
   doPostInstall(argv.framework, pkgNeedPatch, argv.skipCheckVersion, argv.skipCheckNpmcmd);
 }
 

package/tools/jsview-run-tool.mjs

@@ -79,6 +79,7 @@ async function getExtraOptions(argv)
         options.genKeypair = argv.genKeypair; 
         options.buildMinifyExclude = argv.buildMinifyExclude;
         options.buildZip = argv.buildZip; 
+        options.noPassword = argv.noPassword; 
         options.buildBurdenLocal = argv.buildBurdenLocal; 
         options.buildBurdenBaseurl = argv.buildBurdenBaseurl; 
         options.vueDevtools = argv.vueDevtools; 
@@ -129,11 +130,7 @@ function doCommand(options, argv) {
     } else if(options.buildZip) {
         const defaultPassword = 'jsview.shijiu.com';
         const password = (typeof(options.buildZip) === 'string' ? options.buildZip : defaultPassword);
-        if(password !== options.buildZip) {
-            Logger.Warn(`Zip password is not set, use default value: ${defaultPassword}`);
-        }
-
-        command = `node node_modules/@shijiu/jsview/tools/jsview-build-zip.mjs --password=${password}`;
+        command = `node node_modules/@shijiu/jsview/tools/jsview-build-zip.mjs --password=${password} ${options.noPassword ? '--no-password' : ''}`;
     } else if(options.buildBurdenLocal) {
         command = 'JSVIEW_BURDEN_LOCAL=true npm run build';
     } else if(options.buildBurdenBaseurl) {
@@ -217,7 +214,7 @@ const optionalUsages = {
   '-c | --config-app': 'Config app, like: -c or --config-app=[AppName:AppTitle].',
   '-g | --gen-keypair': 'Generate sign keypair.',
   '-m | --build-minify-exclude': 'Build target with minify-exclude filter, like: -m or --build-minify-exclude=[filter], additional options: -s or --script=build:dev.',
-  '-z | --build-zip': 'Build target to offline zip package, like: -z or --build-zip=[password].',
+  '-z | --build-zip': 'Build target to offline zip package, like: -z, --build-zip=[password] or --build-zip --no-password.',
   '-l | --build-burden-local': 'Build target with local burden files.',
   '-b | --build-burden-baseurl': 'Build target with custom burden base url.',
   '-d | --vue-devtools': 'Start vue dev server and vue-devtools standalone, like: -d or --vue-devtools=[port].',

package/tools/jsview-vue-devtools.mjs

@@ -64,7 +64,7 @@ async function runVueDevtoolsStandalone(options)
         console.log()
         console.log()
         Logger.Tip(" *** NOTICE ***:")
-        Logger.Tip(" Don't forget to add the following code at the beginning of your source entry ['main.ts' or 'main.tsx']:")
+        Logger.Tip(" Don't forget to add the following code at the beginning of your source entry ['main.ts']:")
         console.log("    if (process.env.NODE_ENV === 'development') {")
         console.log("      window.requestAnimationFrame = (callback) => setTimeout(callback, 0)")
         console.log("      const devtools = await import('@vue/devtools')")

package/loader/jsview-react-main.js

@@ -1,37 +0,0 @@
-import JsViewLoader from './jsview-loader'
-import AppData from '/src/appConfig/app.config'
-import JsViewVendorConfig from "/src/appConfig/jsview.config"
-import initHeaderScriptLoader from "./jsview-react-script-loader";
-import { PERMISSION } from '/src/appConfig/permission.js'
-
-function main() {
-  const jsviewLoader = new JsViewLoader();
-
-  // 使用vendor配置值覆盖默认配置。
-  const config = jsviewLoader.mergeConfig(JsViewVendorConfig);
-  console.log("JsView config: " + JSON.stringify(config));
-
-  jsviewLoader.initForgeEnv();
-
-  // Webpack 并不能直接运行import语法，需要一个Script加载器
-  if (window.JsView) {
-    initHeaderScriptLoader(config.jsviewConfig.jsSubPath);
-  }
-
-  // 初始化jsview运行环境。
-  const onInitJsViewEnv = async function () {
-    // workaround: 因为React的npm run build后，不能支持top-level-await，
-    // 所以只能在这里加载 JsViewReactWidget/BrowserDebugWidget, 导致了反向依赖问题。
-    // 期待下一个版本的Webpack能修复此问题。
-    if (!window.JsView) {
-      await import("../../jsview-react/utils/JsViewReactWidget/BrowserDebugWidget/WidgetLoader");
-    }
-
-    // JsView环境加载完毕后，加载vue/react的main.js文件。
-    import('/src/main.tsx');
-  };
-  jsviewLoader.initJsViewEnv(AppData.AppName, onInitJsViewEnv, PERMISSION);
-}
-
-// webpack/vite运行入口
-main();

package/loader/jsview-react-script-loader.js

@@ -1,134 +0,0 @@
-/**
- * Created by ludl on 3/30/20.
- */
-
-function alterUrl(origin_url, js_sub_path) {
-  console.log(`++++++++ origin_url=${origin_url} js_sub_path = ${js_sub_path}`);
-  let schema_idx = origin_url.indexOf("://");
-  if (schema_idx < 0 || schema_idx > 10) {
-    // 非schema打头方式，认为是相对路径
-    if (!origin_url.startsWith('./') && !origin_url.startsWith('/')) {
-      origin_url = "./" + origin_url; // 补充相对路径头信息
-    }
-  }
-
-  if (origin_url.startsWith('./') || origin_url.startsWith('/')) {
-    const main_js_path = window.JsView.getAppUrl();
-    let idx = main_js_path.indexOf('?');
-    const host_path = (idx > 0 ? main_js_path.substring(0, idx) : main_js_path);
-    idx = host_path.lastIndexOf(js_sub_path);
-    const path_header = host_path.substring(0, idx);
-
-    let ret;
-    if (origin_url.startsWith('./')) {
-      ret = path_header + origin_url.substring(1);
-    } else {
-      // start with '/'
-      // remove protocal
-      let host_parser = main_js_path;
-      idx = host_parser.indexOf('://');
-      const protocol = (idx > 0 ? host_parser.substring(0, idx) : "");
-      host_parser = (idx > 1 ? host_parser.substring(idx + 3) : "");
-
-      // Get host
-      idx = host_parser.indexOf('/');
-      const host = (idx > 0 ? host_parser.substring(0, idx) : "");
-
-      ret = `${protocol}://${host}${origin_url}`;
-    }
-
-    return ret;
-  }
-  return origin_url;
-}
-
-class LoadingScriptElement {
-  constructor(js_sub_path) {
-    console.log(`++++++++ js_sub_path=${js_sub_path}`);
-    this.src = null;
-    this.onerror = null;
-    this.onload = null;
-    this.charset = null;
-    this.timeout = 120;
-    this._JsSubPath = js_sub_path;
-  }
-
-  setAttribute(name, value) {
-    console.log(`ScriptElement.setAttribute() name=${name}, value=`, value);
-    this[name] = value;
-  }
-
-  jsvActiveScript() {
-    if (this.src !== null) {
-      const url_href = alterUrl(this.src, this._JsSubPath);
-      console.log(`load script with url=${url_href}`);
-      const _this = this;
-      window.JsView.runJsWithUrl(url_href, false, (is_success, err_code) => {
-        _this.onLoadResult(is_success, err_code);
-      });
-    }
-  }
-
-  onLoadResult(is_success, err_code) {
-    console.log(`[Head]onLoadResult ${is_success} ${err_code}`);
-    if (is_success) {
-      if (this.onload) {
-        this.onload();
-      }
-    } else {
-      if (this.onerror) {
-        this.onerror({ type: `[Head]jsvErr_${err_code}`, target: this });
-      }
-    }
-  }
-}
-
-class LoadingHeader {
-  constructor() {
-    console.log("Document header construct");
-  }
-
-  appendChild(node) {
-    if (node instanceof LoadingScriptElement) {
-      console.log("Found append script in head.");
-      node.jsvActiveScript();
-    }
-  }
-}
-
-class LoadingDocument {
-  constructor(js_sub_path) {
-    this.head = new LoadingHeader();
-    this._JsSubPath = js_sub_path;
-  }
-
-  createElement(name) {
-    console.log(`HeaderDocument.createElement() name=${name}`);
-    switch (name) {
-      case "script":
-        return new LoadingScriptElement(this._JsSubPath);
-      default:
-        console.warn(`HeaderDocument.createElement() name=${name}`);
-        return null;
-    }
-  }
-
-  getElementsByTagName(name) {
-    if (name.toLowerCase() === "head") {
-      return [this.head];
-    }
-    if (name.toLowerCase() === "link"
-      || name.toLowerCase() === "script"
-      || name.toLowerCase() === "style") {
-      return [];
-    }
-
-    throw Error("LoadingDocument.getElementsByTagName() name=" + name + " is UNIMPLEMENTED.");
-  }
-}
-
-function initHeaderScriptLoader(js_sub_path) {
-  window.document = new LoadingDocument(js_sub_path);
-}
-
-export default initHeaderScriptLoader;