@vcmap/plugin-cli 1.1.1 → 2.0.3

package/src/hostingHelpers.js

@@ -0,0 +1,300 @@
+import { fileURLToPath, URL } from 'url';
+import { promisify } from 'util';
+import { exec } from 'child_process';
+import https from 'https';
+import http from 'http';
+import fs from 'fs';
+import path from 'path';
+import { logger } from '@vcsuite/cli-logger';
+import { getContext, resolveContext } from './context.js';
+import { getPluginEntry, getPluginName } from './packageJsonHelpers.js';
+
+/**
+ * @typedef {Object} HostingOptions
+ * @property {string} [config] - an optional fileName to use for configuring the plugin
+ * @property {string} [auth] - potential auth string to download assets (index.html, config) with
+ * @property {number} [port]
+ * @property {boolean} [https]
+ */
+
+/**
+ * @type {(arg1: string, opt?: Object) => Promise<string>}
+ */
+const promiseExec = promisify(exec);
+
+/**
+ * @param {...string} pathSegments
+ * @returns {string}
+ */
+export function resolveMapUi(...pathSegments) {
+  return path.join(getContext(), 'node_modules', '@vcmap', 'ui', ...pathSegments);
+}
+
+export function checkReservedDirectories() {
+  ['assets', 'plugins', 'config']
+    .forEach((dir) => {
+      if (fs.existsSync(path.join(getContext(), dir))) {
+        logger.warning(`found reserved directory ${dir}. serving my not work as exptected`);
+      }
+    });
+}
+
+/**
+ * @returns {string}
+ */
+export function getDirname() {
+  return path.dirname(fileURLToPath(import.meta.url));
+}
+
+/**
+ * @param {string} stringUrl
+ * @param {string} auth
+ * @param {function(http.IncomingMessage)} handler
+ */
+export function httpGet(stringUrl, auth, handler) {
+  const url = new URL(stringUrl);
+  const options = {
+    hostname: url.hostname,
+    port: url.port,
+    path: url.pathname,
+  };
+
+  if (auth) {
+    options.headers = { Authorization: `Basic ${Buffer.from(auth).toString('base64')}` };
+  }
+  if (url.protocol === 'https:') {
+    https.get(options, handler);
+  } else {
+    http.get(options, handler);
+  }
+}
+
+/**
+ * @param {string} fileName
+ * @returns {Promise<Object>}
+ */
+export async function readConfigJson(fileName) {
+  const configFileName = fileName || resolveContext('config.json');
+  let config = {};
+  if (fs.existsSync(configFileName)) {
+    const content = await fs.promises.readFile(configFileName);
+    config = JSON.parse(content.toString());
+  }
+
+  return config;
+}
+
+const configMap = new Map();
+
+/**
+ * @returns {Promise<string>}
+ */
+export async function printVcmapUiVersion() {
+  const packageJsonPath = resolveMapUi('package.json');
+  if (!fs.existsSync(packageJsonPath)) {
+    throw new Error(`Cannot find the @vcmap/ui package in ${getContext()}. Are you sure you installed it?`);
+  }
+
+  const content = await fs.promises.readFile(packageJsonPath);
+  const { version } = JSON.parse(content.toString());
+  logger.info(`Using @vcmap/ui version: ${version} found in current project.`);
+}
+
+/**
+ * @param {Object} config
+ * @param {Object} pluginConfig
+ * @param {boolean} production
+ * @returns {Promise<void>}
+ */
+export async function reWriteConfig(config, pluginConfig, production) {
+  config.plugins = config.plugins ?? []; // XXX check if we have plugins in this repos dependencies?
+  pluginConfig.entry = production ? 'dist/index.js' : await getPluginEntry();
+  pluginConfig.name = await getPluginName();
+  const idx = config.plugins.findIndex(p => p.name === pluginConfig.name);
+  if (idx > -1) {
+    config.plugins.splice(idx, 1, pluginConfig);
+  } else {
+    config.plugins.push(pluginConfig);
+  }
+}
+
+/**
+ * @param {string} [mapConfig] - fs or https to config. defaults to @vcmap/ui/map.config.json
+ * @param {string} [auth]
+ * @param {boolean} [production]
+ * @param {string} [configFile]
+ * @returns {Promise<unknown>}
+ */
+export function getConfigJson(mapConfig, auth, production, configFile) {
+  const usedConfig = mapConfig || resolveMapUi('map.config.json');
+  if (configMap.has('map.config.json')) {
+    return Promise.resolve(configMap.get('map.config.json'));
+  }
+  const isWebVcm = /^https?:\/\//.test(usedConfig);
+  return new Promise((resolve, reject) => {
+    function handleStream(stream) {
+      let data = '';
+      stream.on('data', (chunk) => {
+        data += chunk.toString();
+      });
+
+      stream.on('close', async () => {
+        try {
+          const configJson = JSON.parse(data);
+          configMap.set('map.config.json', configJson);
+          const pluginConfig = await readConfigJson(configFile);
+          await reWriteConfig(configJson, pluginConfig, production);
+          resolve(configJson);
+        } catch (e) {
+          reject(e);
+        }
+      });
+    }
+    if (isWebVcm) {
+      httpGet(usedConfig, auth, (res) => {
+        if (res.statusCode < 400) {
+          handleStream(res);
+        }
+      });
+    } else {
+      handleStream(fs.createReadStream(path.join(usedConfig)));
+    }
+  });
+}
+
+/**
+ * @param {string} stringUrl
+ * @param {string} auth
+ * @returns {Promise<string>}
+ */
+function getIndexHtml(stringUrl, auth) {
+  return new Promise((resolve, reject) => {
+    httpGet(stringUrl, auth, (res) => {
+      let index = '';
+      if (res.statusCode >= 400) {
+        logger.error('got status code: ', res.statusCode);
+        reject(new Error(`StatusCode ${res.statusCode}`));
+      }
+      res.on('data', (chunk) => {
+        index += chunk.toString();
+      });
+      res.on('end', () => {
+        resolve(index);
+      });
+    });
+  });
+}
+
+/**
+ * @returns {import("vite").Plugin}
+ */
+export function createConfigJsonReloadPlugin() {
+  return {
+    name: 'ConfigJsonReload',
+    handleHotUpdate({ file }) {
+      if (file === path.join(getContext(), 'config.json')) {
+        configMap.clear();
+      }
+    },
+  };
+}
+
+/**
+ * @param {Express} app
+ * @param {string} mapConfig
+ * @param {string} [auth]
+ * @param {string} [configFile]
+ * @param {boolean} [production]
+ */
+export function addMapConfigRoute(app, mapConfig, auth, configFile, production) {
+  app.get('/map.config.json', (req, res) => {
+    getConfigJson(mapConfig, auth, production, configFile)
+      .then((config) => {
+        const stringConfig = JSON.stringify(config, null, 2);
+        res.setHeader('Content-Type', 'application/json');
+        res.write(stringConfig);
+        res.end();
+      });
+  });
+}
+
+/**
+ * @param {Express} app
+ * @param {string} [auth]
+ * @param {string} [configFileName]
+ * @param {boolean} [production]
+ */
+export async function addConfigRoute(app, auth, configFileName, production) { // IDEA pass in available plugins and strip unavailable ones?
+  const mapUiDir = resolveMapUi();
+  const pluginConfig = await readConfigJson(configFileName);
+
+  app.get('/config*', async (req, res) => {
+    const { url } = req;
+    const fileName = path.join(mapUiDir, ...url.substring(1).split('/'));
+    let response;
+    if (configMap.has(url)) {
+      response = JSON.stringify(configMap.get(url));
+    } else if (fs.existsSync(fileName)) {
+      try {
+        const configContent = await fs.promises.readFile(fileName);
+        const config = JSON.parse(configContent);
+        configMap.set(url, config);
+        await reWriteConfig(config, pluginConfig, production);
+        response = JSON.stringify(config);
+      } catch (e) {
+        configMap.delete(url);
+        logger.warning(`Failed to parse config ${url}`);
+      }
+    }
+
+    if (!response) {
+      res.statusCode = 404;
+    } else {
+      res.setHeader('Content-Type', 'application/json');
+      res.write(response);
+    }
+    res.end();
+  });
+}
+
+/**
+ * @param {boolean} [production]
+ * @returns {Promise<string>}
+ */
+export async function getMapUiIndexHtml(production) {
+  const indexHtmlFileName = production ?
+    resolveMapUi('dist', 'index.html') :
+    path.join(getDirname(), '..', 'assets', 'index.html');
+  const buffer = await fs.promises.readFile(indexHtmlFileName);
+  return buffer.toString();
+}
+
+/**
+ * @param {Express} app
+ * @param {import("vite").ViteDevServer} server
+ * @param {boolean} [production]
+ * @param {string} [hostedVcm]
+ * @param {string} [auth]
+ */
+export function addIndexRoute(app, server, production, hostedVcm, auth) {
+  app.get('/', async (req, res) => {
+    let originalIndex = hostedVcm ?
+      await getIndexHtml(`${hostedVcm}/`, auth) :
+      await getMapUiIndexHtml(production); // TODO change hosted vcm index via option?
+
+    originalIndex = await server.transformIndexHtml('/index.html', originalIndex);
+
+    res.status(200)
+      .set({ 'Content-Type': 'text/html' })
+      .end(originalIndex);
+  });
+}
+
+/**
+ * @param {string} command
+ * @returns {Promise<string>}
+ */
+export function executeUiNpm(command) {
+  const mapUiDir = resolveMapUi();
+  return promiseExec(`npm run ${command}`, { cwd: mapUiDir });
+}

package/src/licenses.js

@@ -1,5 +1,5 @@
-const fs = require('fs');
-const path = require('path');
+import fs from 'fs';
+import path from 'path';
 
 /**
  * @param {string} user
@@ -97,7 +97,7 @@ OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.
 /**
  * @enum {string}
  */
-const LicenseType = {
+export const LicenseType = {
   MIT: 'MIT',
   ISC: 'ISC',
   'APACHE-2.0': 'APACHE-2.0',
@@ -120,14 +120,9 @@ const LicenseTypeFunctions = {
  * @param {string} pluginPath
  * @returns {Promise<void>}
  */
-function writeLicense(user, type, pluginPath) {
+export function writeLicense(user, type, pluginPath) {
   const year = new Date().getFullYear();
   const text = LicenseTypeFunctions[type](user, year);
 
   return fs.promises.writeFile(path.join(pluginPath, 'LICENSE.md'), text);
 }
-
-module.exports = {
-  writeLicense,
-  LicenseType,
-};

package/src/pack.js

@@ -1,12 +1,11 @@
-const { Transform } = require('stream');
-const fs = require('fs');
-const webpack = require('webpack');
-const vinylFs = require('vinyl-fs');
-const archiver = require('archiver');
-const { logger } = require('@vcsuite/cli-logger');
-const { getProdWebpackConfig } = require('./getWebpackConfig');
-const { getPluginName } = require('./packageJsonHelpers');
-const { resolveContext, getContext } = require('./context');
+import { Transform } from 'stream';
+import fs from 'fs';
+import vinylFs from 'vinyl-fs';
+import archiver from 'archiver';
+import { logger } from '@vcsuite/cli-logger';
+import { getPluginName } from './packageJsonHelpers.js';
+import { resolveContext, getContext } from './context.js';
+import build from './build.js';
 
 /**
  * @param {string} name
@@ -17,7 +16,7 @@ function replaceAssets(name) {
     objectMode: true,
     transform(data, encoding, callback) {
       data.contents = Buffer.from(String(data.contents)
-        .replace(/\.?\/?(assets|img|fonts|media)\//g, `plugins/${name}/$1/`));
+        .replace(/\.?\/?(plugin-assets)\//g, `plugins/${name}/$1/`));
 
       callback(null, data);
     },
@@ -69,7 +68,7 @@ async function ensureConfigJson() {
  */
 function zip(name) {
   return new Promise((resolve, reject) => {
-    const zipStream = fs.createWriteStream(resolveContext('dist', `${name}.zip`));
+    const zipStream = fs.createWriteStream(resolveContext('dist', `${name.replace(/\//, '-')}.zip`));
     const archive = archiver('zip', { zlib: { level: 5 } });
 
     zipStream.on('close', () => {
@@ -88,61 +87,38 @@ function zip(name) {
     [
       ['package.json'],
       ['README.md'],
-      ['dist', 'config.json'],
-      ['dist', `${name}.js`],
+      ['config.json'],
+      ['dist', 'index.js'],
+      ['dist', 'style.css'],
     ].forEach((fileArray) => {
-      archive.file(resolveContext(...fileArray), { name: `${name}/${fileArray.pop()}` });
-    });
-
-    ['assets', 'img'].forEach((dir) => {
-      if (fs.existsSync(resolveContext(dir))) {
-        archive.directory(resolveContext(dir), `${name}/${dir}`);
+      const file = resolveContext(...fileArray);
+      if (fs.existsSync(file)) {
+        archive.file(file, { name: `${name}/${fileArray.pop()}` });
       }
     });
 
-    archive.finalize();
-  });
-}
+    if (fs.existsSync(resolveContext('plugin-assets'))) {
+      archive.directory(resolveContext('plugin-assets'), `${name}/plugin-assets`);
+    }
 
-/**
- * @param {ProdOptions} options
- * @returns {Promise<void>}
- */
-function compile(options) {
-  return getProdWebpackConfig(options)
-    .then((webpackConfig) => {
-      return new Promise((resolve, reject) => {
-        webpack(webpackConfig, (err, stats) => {
-          if (err) {
-            logger.error(err);
-            reject(err);
-          } else if (stats.hasErrors()) {
-            logger.log(stats.compilation.errors);
-            reject(stats.compilation.errors[0].Error);
-          } else {
-            logger.success(`build ${options.pluginName}`);
-            resolve();
-          }
-        });
-      });
+    archive.finalize().then(() => {
+      resolve();
     });
+  });
 }
 
 /**
- * @param {ProdOptions} options
  * @returns {Promise<void>}
  */
-async function pack(options) {
-  options.pluginName = options.pluginName || await getPluginName();
-  logger.spin(`building plugin: ${options.pluginName}`);
-  await compile(options);
-  await replaceAssets(options.pluginName);
+export default async function pack() {
+  const pluginName = await getPluginName();
+  logger.spin(`building plugin: ${pluginName}`);
+  await build({});
+  await replaceAssets(pluginName);
   logger.debug('fixed asset paths');
   await ensureConfigJson();
   logger.debug('ensuring config.json');
-  await zip(options.pluginName);
+  await zip(pluginName);
   logger.stopSpinner();
   logger.success('build finished');
 }
-
-module.exports = pack;

package/src/packageJsonHelpers.js

@@ -1,6 +1,5 @@
-const fs = require('fs');
-const path = require('path');
-const { resolveContext } = require('./context');
+import fs from 'fs';
+import { resolveContext } from './context.js';
 
 /** @type {Object|null} */
 let packageJson = null;
@@ -25,28 +24,25 @@ async function getPackageJson() {
 /**
  * @returns {Promise<string>}
  */
-async function getPluginName() {
+export async function getPluginName() {
   const { name } = await getPackageJson();
   if (!name) {
-    throw new Error('please speciy the plugins name in the package.json');
+    throw new Error('please specify the plugins name in the package.json');
   }
   return name;
 }
 
 /**
- * @returns {Promise<string|undefined>}
+ * @returns {Promise<string>}
  */
-async function getPluginEntry() {
+export async function getPluginEntry() {
   const { main, module, type } = await getPackageJson();
 
-  const entry = type === 'module' ? module : main;
-  if (entry && !path.isAbsolute(entry) && !/^\./.test(entry)) { // webpack requires a dot for relative paths
-    return `./${entry}`;
+  let entry = type === 'module' ? module : null;
+  entry = entry || main;
+  if (!entry) {
+    throw new Error('Could not determine entry point');
   }
   return entry;
 }
 
-module.exports = {
-  getPluginName,
-  getPluginEntry,
-};

package/src/preview.js

@@ -0,0 +1,107 @@
+import path from 'path';
+import fs from 'fs';
+import { createServer } from 'vite';
+import express from 'express';
+import { logger } from '@vcsuite/cli-logger';
+import {
+  addConfigRoute,
+  addIndexRoute,
+  addMapConfigRoute,
+  checkReservedDirectories,
+  createConfigJsonReloadPlugin,
+  printVcmapUiVersion, resolveMapUi,
+} from './hostingHelpers.js';
+import build, { getDefaultConfig, getLibraryPaths } from './build.js';
+import { getContext } from './context.js';
+import setupMapUi from './setupMapUi.js';
+
+/**
+ * @typedef {HostingOptions} PreviewOptions
+ * @property {string} [vcm]
+ */
+
+/**
+ * @param {Object<string, string>} alias
+ * @param {Object<string, string>} libraryPaths
+ */
+function setAliases(alias, libraryPaths) {
+  Object.values(libraryPaths).forEach((entry) => {
+    alias[entry] = entry.replace(/(..\/)*assets/, '/assets');
+  });
+}
+
+/**
+ * @param {string} [hostedVcm]
+ * @param {boolean} [https]
+ * @returns {Promise<import("vite").InlineConfig>}
+ */
+async function getServerOptions(hostedVcm, https) {
+  let proxy;
+  const normalLibraries = await getLibraryPaths('normal');
+  const scopedLibraries = await getLibraryPaths('@scoped/plugin');
+  const alias = {};
+  setAliases(alias, normalLibraries);
+  setAliases(alias, scopedLibraries);
+
+  if (hostedVcm) {
+    proxy = {
+      '^/style.css': hostedVcm,
+      '^/assets': hostedVcm,
+      '^/plugins': hostedVcm,
+    };
+  }
+
+  return {
+    publicDir: false,
+    plugins: [
+      createConfigJsonReloadPlugin(),
+    ],
+    resolve: {
+      alias,
+    },
+    server: {
+      middlewareMode: 'html',
+      proxy,
+      https,
+    },
+  };
+}
+
+/**
+ * @param {PreviewOptions} options
+ * @returns {Promise<void>}
+ */
+export default async function preview(options) {
+  if (!options.vcm) {
+    await printVcmapUiVersion();
+  }
+  checkReservedDirectories();
+  await build({ development: false, watch: true });
+  const app = express();
+  logger.info('Starting preview server...');
+  const server = await createServer(await getServerOptions(options.vcm, options.https));
+
+  addMapConfigRoute(app, options.vcm ? `${options.vcm}/map.config.json` : null, options.auth, options.config, true);
+  addIndexRoute(app, server, true, options.vcm, options.auth);
+
+  if (!options.vcm) {
+    logger.spin('compiling preview');
+    if (!fs.existsSync(resolveMapUi('plugins', 'node_modules'))) {
+      logger.info('Could not detect node_modules in map ui plugins. Assuming map UI not setup');
+      await setupMapUi();
+    }
+    const { buildPluginsForPreview } = await import('@vcmap/ui/build/buildHelpers.js');
+    await buildPluginsForPreview(getDefaultConfig(), true);
+    logger.stopSpinner();
+    logger.info('@vcmap/ui built for preview');
+    app.use('/assets', express.static(path.join(getContext(), 'node_modules', '@vcmap', 'ui', 'dist', 'assets')));
+    app.use('/plugins', express.static(path.join(getContext(), 'dist', 'plugins')));
+    await addConfigRoute(app, options.auth, options.config, true);
+  }
+
+  app.use(server.middlewares);
+
+  const port = options.port || 5005;
+  await app.listen(port);
+  logger.info(`Server running on port ${port}`);
+}