@shijiu/jsview 1.9.760 → 1.9.779

package/tools/jsview-jsmap-serve.mjs

@@ -0,0 +1,127 @@
+#!/usr/bin/env node
+'use strict';
+
+import fs from 'fs';
+import http from 'http';
+import os from 'os';
+import path from 'path';
+import url from 'url';
+
+const context = {
+  scriptDir: path.dirname(url.fileURLToPath(import.meta.url)),
+  baseUrl: null,
+  needRedirect: false,
+}
+
+function requestListener(req, res)
+{
+  console.log('[request] ' + req.url);
+
+  if (req.url.endsWith('.map') == false) { // 只处理 .map 文件
+    console.log('JsView Error: Failed to process ' + req.url);
+    res.writeHead(404);
+    res.end();
+    return;
+  }
+
+  // 解决 devtools://devtools 引起的 CORS 问题。
+  res.setHeader('Access-Control-Allow-Origin', '*');
+  res.setHeader('Access-Control-Allow-Methods', 'OPTIONS, GET');
+
+  if (context.needRedirect) {
+    // redirect with 302 HTTP code in response
+    let redirectTarget = context.baseUrl + convertMapBaseUrl(req.url)
+    console.log(`redirect ${req.url} -> ${redirectTarget}`)
+    res.writeHead(302, { 'Location': redirectTarget });
+    return res.end();
+  }
+
+  try {
+    const fileContent = fs.readFileSync(context.baseUrl + '/' + req.url);
+    res.writeHead(200, { 'Content-Type': 'text/plain; charset=utf-8' });
+    res.write(fileContent);
+  } catch (ex) {
+    console.log('JsView Error: Failed to process ' + req.url + '\nException: ' + ex);
+    res.writeHead(404);
+  }
+  res.end();
+  return;
+}
+
+function convertMapBaseUrl(originUrl)
+{
+  if (originUrl.startsWith('/map/')) {
+    /* 去掉子目录/map/ */
+    return originUrl.substr(5); 
+  } else if (originUrl.startsWith('/')) {
+    /* 去掉'/' */
+    return originUrl.substring(1, originUrl.length);
+  } else {
+    return originUrl;
+  }
+}
+
+function getIPAddress()
+{
+  let ret = [];
+
+  var interfaces = os.networkInterfaces();
+  for (var devname in interfaces) {
+    var iface = interfaces[devname];
+
+    for (var i = 0; i < iface.length; i++) {
+      var alias = iface[i];
+      if (alias.family === 'IPv4' && !alias.internal)
+        ret.push(alias.address);
+    }
+  }
+  return ret;
+}
+
+function parseBaseUrl(context, argv)
+{
+  context.baseUrl = context.scriptDir;
+  if (argv.length < 3) {
+    return;
+  }
+
+  const redirectPath = argv[2];
+  const regex = /^(http|https):\/\//i;
+  if (regex.test(redirectPath)) {
+    context.baseUrl = redirectPath;
+    context.needRedirect = true;
+  } else if (redirectPath.startsWith('file://')) {
+    context.baseUrl = url.fileURLToPath(redirectPath)
+  } else {
+    context.baseUrl = path.resolve(process.cwd(), redirectPath);
+  }
+  if (context.baseUrl.endsWith('/') == false) {
+    context.baseUrl += '/';
+  }
+
+  return;
+}
+
+function main(argv)
+{
+  parseBaseUrl(context, argv);
+
+  const server = http.createServer(requestListener);
+  const port = 57245;
+  server.listen(port, '0.0.0.0', () => {
+    const ipAddrs = getIPAddress();
+
+    console.log('');
+    console.log('SourceMap base url: ' + context.baseUrl)
+    console.log('');
+    console.log('JsView server running at:');
+    console.log('');
+    console.log(' - Local:   http://localhost:' + port + '/');
+    for(const ip of ipAddrs) {
+      console.log(' - Network: http://' + ip + ':' + port + '/');
+    }
+    console.log('');
+  });
+}
+
+main(process.argv);

package/tools/jsview-post-build.js

@@ -1,8 +1,10 @@
 #!/usr/bin/env node
+'use strict';
 
 const crypto = require('crypto');
 const fs = require('fs');
 const path = require('path');
+const { getOptions } = require('./jsview-common');
 
 // main.js处理AppData信息
 async function prepareMainAppData(options, fileMd5)
@@ -69,7 +71,7 @@ async function prepareMainAppData(options, fileMd5)
   }
   // const appConfigText = fs.readFileSync(appConfigFile);
   // const appDataOriginJson = JSON.parse(appConfigText);
-  appDataOriginJson = await import(appConfigFile);
+  const appDataOriginJson = await import(appConfigFile);
 
   // 组装AppData
   let targetAppData = {};
@@ -80,31 +82,24 @@ async function prepareMainAppData(options, fileMd5)
   return JSON.stringify(targetAppData);
 }
 
-function signApp(options)
+async function signApp(options)
 {
-  const jsDir = path.resolve(options.distDir, 'js');
-  const jsFiles = fs.readdirSync(jsDir);
-  jsFiles.forEach(async (file, index) => {
-    if (!file.endsWith('.js')) {
-      return;
+  const jsFileNames = fs.readdirSync(options.distJsDir);
+  for(const fileName of jsFileNames) {
+    if (!fileName.endsWith('.js')) {
+      continue;
     }
 
-    const jsFile = path.resolve(jsDir, file);
-    console.log('Updating ' + path.relative(options.projectDir, jsFile));
+    const filePath = path.resolve(options.distJsDir, fileName);
+    // console.log(' -> ' + path.relative(options.projectDir, filePath));
 
-    var jsvAppContents = fs.readFileSync(jsFile);
-    jsvAppContents = jsvAppContents.toString();
+    var sourceContent = fs.readFileSync(filePath, 'utf8');
 
-    let mapOffset = jsvAppContents.lastIndexOf('# sourceMappingURL='); // 避免代码中间位置的sourceMappingUrl内容被替换
-    let mapStr = (jsvAppContents.substring(mapOffset, jsvAppContents.length)).replace(
-      '# sourceMappingURL=', '# sourceMappingURL=http://localhost:57245/map/');
-    jsvAppContents = jsvAppContents.substring(0, mapOffset) + mapStr;
-
-    jsvAppContents += '\n'; // 把\n归入算进md5计算中
+    sourceContent += '\n'; // 把\n归入算进md5计算中
 
-    const jsvAppMd5 = crypto.createHash('md5').update(jsvAppContents).digest('hex');
+    const jsvAppMd5 = crypto.createHash('md5').update(sourceContent).digest('hex');
     let appDataInfo = '';
-    if (jsFile.indexOf('main.jsv.') > 0) {
+    if (fileName.indexOf('main.jsv.') >= 0) {
       // 对main文件加入应用头信息
       appDataInfo = await prepareMainAppData(options, jsvAppMd5);
 
@@ -113,54 +108,66 @@ function signApp(options)
       const infoLen = new TextEncoder().encode(appDataInfo).length;
       appDataInfo = '/*jsvapp:' + infoLen + ':' + appDataInfo + ':' + infoLen + ':jsvapp*/';
     }
-    jsvAppContents = jsvAppContents + appDataInfo + '/*jsvmd5:' + jsvAppMd5 + '*/';
-    fs.writeFileSync(jsFile, jsvAppContents);
-  });
+    sourceContent = sourceContent + appDataInfo + '/*jsvmd5:' + jsvAppMd5 + '*/';
+    fs.writeFileSync(filePath, sourceContent, 'utf8');
+  }
+}
+
+function redirectSourceMappingURL(options)
+{
+  const jsFileNames = fs.readdirSync(options.distJsDir);
+  for(const fileName of jsFileNames) {
+    if (!fileName.endsWith('.js')) {
+      continue;
+    }
+
+    const filePath = path.resolve(options.distJsDir, fileName);
+    // console.log(' -> ' + path.relative(options.projectDir, filePath));
+
+    let sourceContent = fs.readFileSync(filePath, 'utf8');
+
+    let mapUrlOffset = sourceContent.lastIndexOf('# sourceMappingURL='); // 避免代码中间位置的sourceMappingUrl内容被替换
+    let mapUrlStr = (sourceContent.substring(mapUrlOffset, sourceContent.length)).replace(
+      '# sourceMappingURL=', '# sourceMappingURL=http://localhost:57245/map/');
+    sourceContent = sourceContent.substring(0, mapUrlOffset) + mapUrlStr;
+
+    fs.writeFileSync(filePath, sourceContent, 'utf8');
+  };
 }
 
 function makeDebugMap(options)
 {
-  fs.mkdirSync(options.mapDir, { recursive: true });
+  fs.mkdirSync(options.distDebugMapDir, { recursive: true });
 
-  const jsDir = path.resolve(options.distDir, 'js');
-  const jsFiles = fs.readdirSync(jsDir);
-  jsFiles.forEach((file, index) => {
-    if (!file.endsWith('.map')) {
-      return;
+  const jsFileNames = fs.readdirSync(options.distJsDir);
+  for(const fileName of jsFileNames) {
+    if (!fileName.endsWith('.map')) {
+      continue;
     }
 
-    const from = path.resolve(jsDir, file);
-    const to = path.resolve(options.mapDir, file);
-    console.log("Moving " + path.relative(options.projectDir, to));
+    const from = path.resolve(options.distJsDir, fileName);
+    const to = path.resolve(options.distDebugMapDir, fileName);
+    // console.log(' -> ' + path.relative(options.projectDir, to));
     fs.renameSync(from, to);
-  });
+  };
 
-  const jsmapServeName = "jsview-jsmap-serve.js";
-  const jsmapServePath = path.resolve(options.toolsDir, jsmapServeName);
+  const jsmapServeName = 'jsview-jsmap-serve.mjs';
+  const jsmapServePath = path.resolve(options.jsviewToolsDir, jsmapServeName);
   if (!fs.existsSync(jsmapServePath)) {
-    console.error("Failed to copy " + jsmapServePath  + ", file not exists.");
+    console.error('JsView Error: Failed to copy ' + jsmapServePath  + ', file not exists.');
     process.exit(1);
   }
 
-  const to = path.resolve(options.debugDir, jsmapServeName);
-  console.log("Making " + path.relative(options.projectDir, to));
+  const to = path.resolve(options.distDebugDir, jsmapServeName);
+  console.log(' -> ' + path.relative(options.projectDir, to));
   fs.copyFileSync(jsmapServePath, to);
 }
 
-function main() {
-  const options = {};
-  options.projectDir = process.cwd();
-  options.modulesDir = path.resolve(options.projectDir, "node_modules");
-  options.jsviewDir = path.resolve(options.modulesDir, "@shijiu", "jsview");
-  options.patchesDir = path.resolve(options.jsviewDir, "patches");
-  options.toolsDir = path.resolve(options.jsviewDir, "tools");
-  options.distDir = path.resolve(options.projectDir, "dist");
-  options.appConfigDir = path.resolve(options.projectDir, "src", "appConfig");
-  options.debugDir = path.resolve(options.distDir, "debug");
-  options.mapDir = path.resolve(options.debugDir, "map");
-
+async function main()
+{
+  const options = getOptions();
 
-  vueConfigFile = path.resolve(options.projectDir, 'vue.config.js');
+  const vueConfigFile = path.resolve(options.projectDir, 'vue.config.js');
   if (fs.existsSync(vueConfigFile)) {
     vueCfgObj = require(vueConfigFile);
     if(vueCfgObj.outputDir) {
@@ -168,16 +175,17 @@ function main() {
     }
   }
 
-  console.info('Signing JsView App...');
-  console.info();
-  signApp(options);
   console.info();
+  console.info('Redirecting JsView source map...');
+  redirectSourceMappingURL(options)
+  console.info('Redirected JsView source map...');
+
+  console.info('Signing JsView App...');
+  await signApp(options);
   console.info('Signed JsView App.');
 
   console.info('Making JsView Debug map...');
-  console.info();
   makeDebugMap(options);
-  console.info();
   console.info('Made JsView Debug map.');
 }
 

package/tools/jsview-post-install.js

@@ -1,11 +1,20 @@
 #!/usr/bin/env node
+'use strict';
 
 const fs = require('fs');
 const path = require('path');
-const { pathToFileURL } = require('url');
-const { cpSync, rmSync } = require('./common');
-
-function checkNpmCommand() {
+const url = require('url');
+const {
+  cpSync,
+  getOptions,
+  getPackageObject,
+  parseArguments,
+  symlinkSync,
+  rmSync
+} = require('./jsview-common');
+
+function checkNpmCommand()
+{
   let command = process.env.npm_command;
   if(!command) {
     command = process.env.npm_config_refer; // for linux
@@ -20,54 +29,61 @@ function checkNpmCommand() {
   console.warn();
 }
 
-function getPackageObject(options, dir, name)
+function checkNpmLinkForDebug(options, linkablePkgNames)
 {
-  const pkgFullFile = path.resolve(dir, name, 'package.json');
-  if (!fs.existsSync(pkgFullFile)) {
-    console.error('Error: Failed to install jsview patches, "' + path.relative(options.projectDir, pkgFullFile) + '" is not exists.');
-    process.exit(1);
-  }
-  const pkgObj = require(pkgFullFile);
+  const pkgObj = getPackageObject(options.projectDir);
 
-  return pkgObj;
-}
+  for (const linkableName of linkablePkgNames) {
+    let linkableTarget = pkgObj.dependencies?.[linkableName];
+    if (!linkableTarget || !linkableTarget.startsWith('file:')) {
+      continue;
+    }
 
-function checkPatches(options, pkgNeedPatch, skipCheckVersion) {
-  console.info("Checking package:");
-  for (pkgName of pkgNeedPatch) {
-    if (skipCheckVersion == false) {
-      const patchPkgObj = getPackageObject(options, path.resolve(options.patchesDir, 'node_modules'), pkgName);
-      console.info("  " + pkgName + ": " + patchPkgObj.version);
+    linkableTarget = linkableTarget.replace('file:', '');
+    const linkableTargetPath = path.resolve(options.projectDir, linkableTarget);
+    const linkablePath = path.resolve(options.modulesDir, linkableName);
+    symlinkSync(linkableTargetPath, linkablePath);
+  }
+}
 
-      const modulePkgObj = getPackageObject(options, options.modulesDir, pkgName);
+function checkPatches(options, pkgNeedPatch, skipCheckVersion)
+{
+  console.info('Checking package:');
+  for (const pkgName of pkgNeedPatch) {
+    if (skipCheckVersion !== true) {
+      const patchPkgDir = path.resolve(options.jsviewPatchModulesDir, pkgName);
+      const patchPkgObj = getPackageObject(options, patchPkgDir);
+      console.info('  ' + pkgName + ': ' + patchPkgObj.version);
+
+      const modulePkgDir = path.resolve(options.modulesDir, pkgName);
+      const modulePkgObj = getPackageObject(modulePkgDir);
       if (modulePkgObj.version != patchPkgObj.version) {
         console.error('Error: ' + pkgName + '@' + modulePkgObj.version + ' is not supported, required version is ' + patchPkgObj.version);
         process.exit(1);
       }
     } else {
-      console.info("  Skip ", pkgName);
+      console.info('  Skip ', pkgName);
     }
   }
 }
 
-function installPatches(options, pkgNeedPatch) {
+function installPatches(options, pkgNeedPatch)
+{
   console.info('\nPatching JsView:');
-  for (pkgName of pkgNeedPatch) {
-    const patchSrc = path.resolve(options.patchesDir, 'node_modules', pkgName);
+  for (const pkgName of pkgNeedPatch) {
+    const patchSrc = path.resolve(options.jsviewPatchModulesDir, pkgName);
     const patchDest = path.resolve(options.modulesDir, pkgName);
 
     cpSync(options.projectDir, patchSrc, patchDest, ['package.json']);
   }
 
   console.info('\nCleanup node_modules cache... ');
-  const nodeModuleCacheDir = path.resolve(options.modulesDir, '.cache');
-  rmSync(nodeModuleCacheDir);
+  rmSync(options.cacheDir);
 }
 
-async function printRevision(options) {
-  const jsviewVersionFile = path.resolve(options.jsviewDir, 'dom', 'target_core_revision.mjs');
-
-  const jsviewVersionURL = pathToFileURL(jsviewVersionFile);
+async function printRevision(options)
+{
+  const jsviewVersionURL = url.pathToFileURL(options.jsviewRevisionFile);
   const { default: jsviewTargetVersion } = await import(jsviewVersionURL);
 
   console.log('**************************************************');
@@ -81,8 +97,9 @@ async function printRevision(options) {
   {
     let pluginDirPath = path.resolve(options.jsviewFrameworkDir, 'utils', 'JsViewPlugin');
     if(fs.existsSync(pluginDirPath)) {
-      fs.readdirSync(pluginDirPath).forEach((file) => {
-        var pathname = path.resolve(pluginDirPath, file);
+      const pluginFileNames = fs.readdirSync(pluginDirPath);
+      for(const fileName of pluginFileNames) {
+        var pathname = path.resolve(pluginDirPath, fileName);
         if (fs.statSync(pathname).isDirectory()) {
           let versionFilePath = path.resolve(pathname, 'version.js'); 
           if (fs.existsSync(versionFilePath)) {
@@ -101,17 +118,23 @@ async function printRevision(options) {
   console.log('**************************************************');
 }
 
-function doPostInstall(framework, pkgNeedPatch, skipCheckVersion) {
-  const options = {};
+function doPostInstall(framework, pkgNeedPatch, skipCheckVersion)
+{
+  const options = getOptions(framework);
   options.projectDir = process.cwd();
-  options.modulesDir = path.resolve(options.projectDir, 'node_modules');
-  options.jsviewDir = path.resolve(options.modulesDir, '@shijiu', 'jsview');
-  options.jsviewFrameworkDir = path.resolve(options.modulesDir, '@shijiu', 'jsview-' + framework);
-  options.patchesDir = path.resolve(options.jsviewDir, 'patches');
-  options.distDir = path.resolve(options.projectDir, 'dist');
+
+  const linkablePkgNames = [
+    '@shijiu/jsview',
+    '@shijiu/jsview-vue',
+    '@shijiu/jsview-vue-samples',
+    '@shijiu/jsview-react',
+    '@shijiu/jsview-react-samples',
+  ]
 
   checkNpmCommand();
 
+  checkNpmLinkForDebug(options, linkablePkgNames);
+
   checkPatches(options, pkgNeedPatch, skipCheckVersion);
 
   installPatches(options, pkgNeedPatch);
@@ -119,6 +142,33 @@ function doPostInstall(framework, pkgNeedPatch, skipCheckVersion) {
   printRevision(options);
 }
 
-module.exports = {
-  doPostInstall
-};
+function main(argv)
+{
+  let pkgNeedPatch;
+
+  switch (argv.framework) {
+    case 'vue':
+      pkgNeedPatch = [
+        '@vue/compiler-sfc',
+        '@vue/runtime-core',
+        '@vue/runtime-dom',
+        'postcss-js',
+        'vite',
+        'vue-router',
+      ];
+      break;
+    case 'react':
+      pkgNeedPatch = [
+        'react-dom',
+        'react-scripts',
+      ];
+      break;
+    default:
+      throw new Error('JsView Error: Failed to support framework: ' + framework);
+  }
+
+  doPostInstall(argv.framework, pkgNeedPatch, argv.skipCheckVersion);
+}
+
+const argv = parseArguments();
+main(argv);

package/tools/jsview-run-android.js

@@ -1,53 +1,60 @@
 #!/usr/bin/env node
+'use strict';
 
 const childProcess = require('child_process');
 const path = require('path');
-const { pathToFileURL } = require('url');
+const url = require('url');
+const {
+    getOptions,
+    parseArguments
+} = require('./jsview-common');
 
-async function getOptions() {
-    const options = {
-        androidPackage: "com.qcode.jsview.sample_demo/com.qcode.jsview.sample.SingleActivity",
-        coreRevision: null,
-        jseUrl: null,
-        homepageUrl: null,
-    }
+async function getExtraOptions(argv)
+{
+    const options = getOptions(argv.framework);
+    options.androidPackage = 'com.tvcode.sjcenter/com.tvcode.chmarket.MainActivity';
+    options.jsviewCoreRevision = null;
+    options.jsviewEngineUrl = null;
+    options.entryUrl = null;
 
-    if (process.argv.length >= 3) {
-        options.androidPackage = process.argv[2];
+    if (argv.unparsed.length > 0) {
+        options.androidPackage = argv.unparsed[0];
     }
 
-    const projectDir = process.cwd();
-    const modulesDir = path.resolve(projectDir, 'node_modules');
-    const jsviewDir = path.resolve(modulesDir, '@shijiu', 'jsview');
-    const jsviewVersionFile = path.resolve(jsviewDir, 'dom', 'target_core_revision.mjs');
-    const jsviewVersionURL = pathToFileURL(jsviewVersionFile);
-    const { default: jsviewTargetVersion } = await import(jsviewVersionURL);
-    options.coreRevision = jsviewTargetVersion.CoreRevision;
-    options.jseUrl = jsviewTargetVersion.JseUrl;
+    const jsviewRevisionFile = url.pathToFileURL(options.jsviewRevisionFile);
+    const { default: jsviewTargetRevision } = await import(jsviewRevisionFile);
+    options.jsviewCoreRevision = jsviewTargetRevision.CoreRevision;
+    options.jsviewEngineUrl = jsviewTargetRevision.JseUrl;
+
+    const baseUrlFile = url.pathToFileURL(options.baseUrlFile);
+    let { default: baseUrl } = await import(baseUrlFile);
+    baseUrl = baseUrl.replace(/\u001b\[.*?m/g, '')
+    options.entryUrl = baseUrl + 'js/main.jsv.js';
 
-    const homepageUrlFile = path.resolve(modulesDir, '.vite', 'jsview', 'network.mjs');
-    let { default: homepageDomain } = await import(homepageUrlFile);
-    homepageDomain = homepageDomain.replace(/\u001b\[.*?m/g, '')
-    options.homepageUrl = homepageDomain + "js/main.jsv.js?module=true";
+    if (argv.framework === 'vue') {
+        options.entryUrl += '?module=true';
+    }
 
     return options;
 }
 
-function printRevision(options) {
-    console.log("**************************************************");
-    console.log("* Android Package: " + options.androidPackage);
-    console.log("* Core:            " + options.coreRevision);
-    console.log("* Engine JS url:   " + options.jseUrl);
-    console.log("* Homepage url:    " + options.homepageUrl);
-    console.log("**************************************************");
+function printRevision(options)
+{
+    console.log('**************************************************');
+    console.log('* Android Package: ' + options.androidPackage);
+    console.log('* Core:            ' + options.jsviewCoreRevision);
+    console.log('* Engine JS url:   ' + options.jsviewEngineUrl);
+    console.log('* Homepage url:    ' + options.entryUrl);
+    console.log('**************************************************');
 }
 
-function androidStartActivity(options) {
-    let cmdline = "adb shell am start";
+function androidStartActivity(options)
+{
+    let cmdline = 'adb shell am start';
     cmdline += ` -n ${options.androidPackage}`;
-    cmdline += ` --es COREVERSIONRANGE "${options.coreRevision}"`;
-    cmdline += ` --es ENGINE "${options.jseUrl}"`;
-    cmdline += ` --es URL "${options.homepageUrl}"`;
+    cmdline += ` --es COREVERSIONRANGE "${options.jsviewCoreRevision}"`;
+    cmdline += ` --es ENGINE "${options.jsviewEngineUrl}"`;
+    cmdline += ` --es URL "${options.entryUrl}"`;
     console.log(`Run command: ${cmdline}\n`);
     try {
         childProcess.execSync(cmdline, {stdio: [0, 1, 2]});
@@ -56,12 +63,13 @@ function androidStartActivity(options) {
     }
 }
 
-
-async function main() {
-    const options = await getOptions();
+const argv = parseArguments(false);
+async function main(argv)
+{
+    const options = await getExtraOptions(argv);
 
     printRevision(options);
 
     androidStartActivity(options);
 }
-main()
+main(argv)

package/patches/node_modules/vite/dist/node/jsview-react.vite.config.js

@@ -1,7 +0,0 @@
-import path from 'path'
-import jsviewViteConfig from './jsview.vite.config.js'
-
-jsviewViteConfig.resolve.alias['jsview']
-  = path.resolve(process.cwd(), 'node_modules/@shijiu/jsview-react');
-
-export default jsviewViteConfig;

package/patches/node_modules/vite/dist/node/jsview-vue.vite.config.js

@@ -1,7 +0,0 @@
-import path from 'path'
-import jsviewViteConfig from './jsview.vite.config.js'
-
-jsviewViteConfig.resolve.alias['jsview']
-  = path.resolve(process.cwd(), 'node_modules/@shijiu/jsview-vue');
-
-export default jsviewViteConfig;