@windwalker-io/core 4.1.11 → 4.2.0

package/src/legacy/4.0/js-sync.mjs

@@ -1,74 +1,74 @@
-import { findModules } from '@windwalker-io/core/src/index.mjs';
-import { dest as toDest, src, ts } from '@windwalker-io/fusion';
-import { postStream, prepareStream } from '@windwalker-io/fusion/src/lifecycles.js';
-import { extractDest } from '@windwalker-io/fusion/src/utilities/utilities.js';
-import { existsSync } from 'fs';
-import rename from 'gulp-rename';
-import path from 'path';
-
-/**
- * @deprecated
- */
-export function jsSync(source = 'src/Module', dest, options = {}) {
-  const tsOptions = options.ts || {};
-
-  if (!tsOptions.tsconfig) {
-    tsOptions.tsconfig = path.resolve('tsconfig.json');
-
-    if (!existsSync(tsOptions.tsconfig)) {
-      tsOptions.tsconfig = path.resolve('node_modules/@windwalker-io/unicorn/tsconfig.js.json');
-    }
-  }
-
-  const sourceList = [];
-
-  sourceList.push(...findModules('**/assets/*.{js,mjs}'));
-  sourceList.push(source + '**/assets/*.{js,mjs}');
-
-  let stream = prepareStream(src(sourceList));
-
-  stream = stream.pipe(rename((path) => {
-    path.dirname = path.dirname.replace(/assets$/, '').toLowerCase();
-  }));
-
-  const jsDest = extractDest(dest);
-
-  //
-  // // if (dest.merge) {
-  // //   stream = stream.pipe(rename(path.basename(dest.file)));
-  // // }
-  //
-  stream = stream.pipe(toDest(jsDest.path).on('error', e => console.error(e)));
-
-  return Promise.all([
-    new Promise((resolve) => {
-      postStream(stream).on('end', (event) => {
-        const data = {
-          event,
-          src,
-          dest: jsDest,
-          stream
-        };
-
-        resolve(data);
-      });
-    }),
-    // Legacy mode
-    ts(
-      [
-        ...findModules('**/assets/*.ts'),
-        'node_modules/@windwalker-io/unicorn/src/types/*.d.ts',
-        `${source}/**/*.ts`,
-      ],
-      dest,
-      {
-        rename: (path) => {
-          path.dirname = path.dirname.replace(/assets$/, '').toLowerCase();
-        },
-        ...tsOptions
-      }
-    )
-  ]).then((v) => {
-    return v[0];
-  });
-}
+import { findModules } from '@windwalker-io/core/src/index.mjs';
+import { dest as toDest, src, ts } from '@windwalker-io/fusion';
+import { postStream, prepareStream } from '@windwalker-io/fusion/src/lifecycles.js';
+import { extractDest } from '@windwalker-io/fusion/src/utilities/utilities.js';
+import { existsSync } from 'fs';
+import rename from 'gulp-rename';
+import path from 'path';
+
+/**
+ * @deprecated
+ */
+export function jsSync(source = 'src/Module', dest, options = {}) {
+  const tsOptions = options.ts || {};
+
+  if (!tsOptions.tsconfig) {
+    tsOptions.tsconfig = path.resolve('tsconfig.json');
+
+    if (!existsSync(tsOptions.tsconfig)) {
+      tsOptions.tsconfig = path.resolve('node_modules/@windwalker-io/unicorn/tsconfig.js.json');
+    }
+  }
+
+  const sourceList = [];
+
+  sourceList.push(...findModules('**/assets/*.{js,mjs}'));
+  sourceList.push(source + '**/assets/*.{js,mjs}');
+
+  let stream = prepareStream(src(sourceList));
+
+  stream = stream.pipe(rename((path) => {
+    path.dirname = path.dirname.replace(/assets$/, '').toLowerCase();
+  }));
+
+  const jsDest = extractDest(dest);
+
+  //
+  // // if (dest.merge) {
+  // //   stream = stream.pipe(rename(path.basename(dest.file)));
+  // // }
+  //
+  stream = stream.pipe(toDest(jsDest.path).on('error', e => console.error(e)));
+
+  return Promise.all([
+    new Promise((resolve) => {
+      postStream(stream).on('end', (event) => {
+        const data = {
+          event,
+          src,
+          dest: jsDest,
+          stream
+        };
+
+        resolve(data);
+      });
+    }),
+    // Legacy mode
+    ts(
+      [
+        ...findModules('**/assets/*.ts'),
+        'node_modules/@windwalker-io/unicorn/src/types/*.d.ts',
+        `${source}/**/*.ts`,
+      ],
+      dest,
+      {
+        rename: (path) => {
+          path.dirname = path.dirname.replace(/assets$/, '').toLowerCase();
+        },
+        ...tsOptions
+      }
+    )
+  ]).then((v) => {
+    return v[0];
+  });
+}

package/src/next/fusion/index.ts

@@ -0,0 +1,2 @@
+export * from './plugins';
+export * from './processors';

package/src/next/fusion/plugins/assets.ts

@@ -0,0 +1,29 @@
+import { type FusionPlugin } from '@windwalker-io/fusion-next';
+import { getAvailableForReposition, handleCloneAssets, handleReposition } from '../processors/cloneAssets';
+
+export interface WindwalkerAssetsOptions {
+  clone?: Record<string, string>;
+  reposition?: Record<string, string>;
+}
+
+export function globalAssets(options: WindwalkerAssetsOptions): FusionPlugin {
+  return {
+    name: 'core:global-assets',
+    buildConfig(builder) {
+      const clone = options.clone || {};
+      let reposition = options.reposition || {};
+
+      reposition = { ...reposition, ...getAvailableForReposition(clone) };
+
+      // Handle reposition
+      handleReposition(builder, reposition);
+
+      const clonePatterns = Object.keys(clone);
+
+      // Handle clone
+      if (clonePatterns.length > 0) {
+        handleCloneAssets(builder, clonePatterns);
+      }
+    }
+  };
+}

package/src/next/fusion/plugins/index.ts

@@ -0,0 +1,3 @@
+export * from './assets';
+export * from './systemjs';
+

package/src/next/fusion/plugins/systemjs.ts

@@ -0,0 +1,66 @@
+import fs from 'fs-extra';
+import { resolve } from 'node:path';
+import type { OutputAsset, OutputChunk } from 'rollup';
+import type { PluginOption } from 'vite';
+
+export function injectSystemJS(systemPath?: string, filter?: (file: OutputAsset | OutputChunk) => any): PluginOption {
+  systemPath ??= resolve('node_modules/systemjs/dist/system.min.js');
+
+  return {
+    name: 'core:inject-systemjs',
+    async generateBundle(options, bundle) {
+      if (options.format !== 'system') {
+        return;
+      }
+
+      const systemjsCode = fs.readFileSync(
+        resolve(systemPath),
+        'utf-8'
+      );
+
+      for (const file of Object.values(bundle)) {
+        if (filter && !filter(file)) {
+          continue;
+        }
+
+        if (file.type === 'chunk' && file.isEntry && file.fileName.endsWith('.js')) {
+          file.code = systemjsCode + '\n' + file.code;
+        }
+      }
+    }
+  };
+}
+
+export function systemCSSFix(): PluginOption {
+  return {
+    name: 'core:systemjs-css-fix',
+    async generateBundle(options, bundle) {
+      if (options.format !== 'system') {
+        return;
+      }
+
+      for (const [fileName, chunk] of Object.entries(bundle)) {
+        if (fileName.endsWith('.css') && 'code' in chunk) {
+          const regex = /__vite_style__\.textContent\s*=\s*"([\s\S]*?)";/;
+          let match = chunk.code.match(regex);
+
+          // For minified
+          if (!match) {
+            const regex = /\.textContent\s*=\s*`([\s\S]*?)`/;
+            match = chunk.code.match(regex);
+          }
+
+          if (match && match[1]) {
+            chunk.code = match[1]
+              .replace(/\\"/g, '"')
+              .replace(/\\n/g, '\n')
+              .replace(/\\t/g, '\t')
+              .replace(/\\\\/g, '\\')
+              .replace(/\/\*\$vite\$:\d+\*\/$/, '')
+          }
+        }
+      }
+    }
+  };
+}
+

package/src/next/fusion/processors/cloneAssets.ts

@@ -0,0 +1,81 @@
+import { callback, type ConfigBuilder } from '@windwalker-io/fusion-next';
+import isGlob from 'is-glob';
+import micromatch from 'micromatch';
+import { normalize } from 'node:path';
+import { relative } from 'node:path';
+import { containsMiddleGlob, removeLastGlob, uniqId } from '../../utilities';
+
+export function cloneAssets(patterns: Record<string, string>) {
+  return callback((taskName, builder) => {
+    const reposition = getAvailableForReposition(patterns);
+
+    handleReposition(builder, reposition);
+
+    handleCloneAssets(builder, Object.keys(patterns));
+
+    return null;
+  });
+}
+
+export function getAvailableForReposition(patterns: Record<string, string>) {
+  const reposition: Record<string, string> = {};
+
+  for (const from in patterns) {
+    // If clone from contains middle glob: eg. `assets/**/files`, we cannot handle the naming
+    // Let the naming options to handle it.
+    if (!containsMiddleGlob(from)) {
+      reposition[from] = patterns[from];
+    }
+  }
+
+  return reposition;
+}
+
+export function handleCloneAssets(builder: ConfigBuilder, clonePatterns: string[]) {
+  // An module starts `hidden:` will be ignored by fusion
+  const id = uniqId('hidden:clone-asset-') + '.js';
+
+  const task = builder.addTask(id);
+
+  builder.resolveIdCallbacks.push((src) => {
+    if (src === id) {
+      return id;
+    }
+  });
+
+  builder.loadCallbacks.push((src) => {
+    if (src === id) {
+      const glob = clonePatterns
+        // Replace slash to unix style
+        .map(v => v.replace(/\\/g, '/'))
+        // Glob in virtual module should start with /
+        .map(v => v.startsWith('./') || !v.startsWith('/') ? `/${v}` : v)
+        // wrap with quotes
+        .map(v => `'${v}'`)
+        // join it to string.
+        .join(', ');
+
+      return `import.meta.glob(${glob});\n`;
+    }
+  });
+}
+
+export function handleReposition(builder: ConfigBuilder, reposition: Record<string, string>) {
+  builder.assetFileNamesCallbacks.push((assetInfo) => {
+    const fileName = assetInfo.originalFileName!;
+
+    for (const base in reposition) {
+      if (match(fileName, base)) {
+        return normalize(reposition[base] + relative(removeLastGlob(base), fileName)).replace(/\\/g, '/');
+      }
+    }
+  });
+}
+
+function match(str: string, pattern: string) {
+  if (isGlob(pattern)) {
+    return micromatch.isMatch(str, pattern);
+  }
+
+  return str.startsWith(pattern);
+}

package/src/next/fusion/processors/cssModulize.ts

@@ -0,0 +1,105 @@
+import { stripUrlQuery } from '@/next';
+import { type ConfigBuilder, css, type ProcessorInterface, type ProcessorPreview } from '@windwalker-io/fusion-next';
+import { WatchTask } from '@windwalker-io/fusion-next/src/types';
+import fg from 'fast-glob';
+import fs from 'fs-extra';
+import { parse } from 'node-html-parser';
+import { normalize, resolve } from 'node:path';
+
+export function cssModulize(entry: string, dest: string) {
+  return new CssModulizeProcessor(css(entry, dest));
+}
+
+class CssModulizeProcessor implements ProcessorInterface {
+
+  constructor(
+    protected processor: ReturnType<typeof css>,
+    protected bladePatterns: string[] = [],
+    protected cssPatterns: string[] = []
+  ) {
+
+  }
+
+  parseBlades(...bladePatterns: (string[] | string)[]) {
+    this.bladePatterns = this.bladePatterns.concat(bladePatterns.flat());
+
+    return this;
+  }
+
+  mergeCss(...css: (string[] | string)[]) {
+    this.cssPatterns = this.cssPatterns.concat(css.flat());
+
+    return this;
+  }
+
+  config(taskName: string, builder: ConfigBuilder) {
+    const tasks = this.processor.config(taskName, builder);
+    const task = tasks[0];
+    const inputFile = resolve(task.input);
+
+    // get blade styles and add watches
+    const bladeFiles = fg.globSync(this.bladePatterns);
+
+    for (const file of bladeFiles) {
+      builder.watches.push({
+        file,
+        moduleFile: inputFile,
+        updateType: 'css-update',
+      } satisfies WatchTask);
+    }
+
+    builder.loadCallbacks.push((src, options) => {
+      const file = stripUrlQuery(src);
+
+      if (normalize(file) === inputFile) {
+        const patterns = fg.globSync(
+          this.cssPatterns.map((v) => resolve(v))
+            .map(v => v.replace(/\\/g, '/'))
+        );
+
+        const imports = patterns
+          .map((pattern) => `@import "${pattern}";`)
+          .concat(this.parseStylesFromBlades(bladeFiles))
+          .join('\n');
+
+        let main = fs.readFileSync(file, 'utf-8');
+
+        main += `\n\n${imports}\n`;
+
+        return main;
+      }
+    });
+
+    return undefined;
+  }
+
+  parseStylesFromBlades(files: string[]) {
+    return files.map((file) => {
+      const bladeText = fs.readFileSync(file, 'utf8');
+
+      const html = parse(bladeText);
+
+      return html.querySelectorAll('style[type][data-macro],script[type][data-macro]')
+        .filter(
+          (el) => ['text/scss', 'text/css'].includes(el.getAttribute('type') || '')
+        )
+        .map((el) => {
+          const scope = el.getAttribute('data-scope');
+
+          if (scope) {
+            return `${scope} {
+          ${el.innerHTML}
+        }`;
+          } else {
+            return el.innerHTML;
+          }
+        });
+    })
+      .filter((c) => c.length > 0)
+      .flat();
+  }
+
+  preview(): ProcessorPreview[] {
+    return [];
+  }
+}

package/src/next/fusion/processors/index.ts

@@ -0,0 +1,4 @@
+export { cssModulize } from './cssModulize';
+export { jsModulize } from './jsModulize';
+export { installVendors } from './installVendors';
+export { cloneAssets } from './cloneAssets';

package/src/next/fusion/processors/installVendors.ts

@@ -0,0 +1,178 @@
+import { callbackAfterBuild, copyGlob, symlink } from '@windwalker-io/fusion-next';
+import fs from 'fs-extra';
+import path from 'node:path';
+import { loadJson } from '../../utilities';
+
+export function installVendors(
+  npmVendors: string[] = [],
+  to: string = 'www/assets/vendor',
+) {
+  return callbackAfterBuild(() => findAndInstall(npmVendors, to));
+}
+
+enum InstallAction {
+  LINK = 'Link',
+  COPY = 'Copy',
+}
+
+export async function findAndInstall(npmVendors: string[] = [], to = 'www/assets/vendor') {
+  const root = to;
+  let vendors = npmVendors;
+  const action = process.env.INSTALL_VENDOR === 'hard' ? InstallAction.COPY : InstallAction.LINK;
+
+  console.log("");
+
+  if (!fs.existsSync(root)) {
+    fs.mkdirSync(root);
+  }
+
+  const dirs = fs.readdirSync(root, { withFileTypes: true })
+    .filter(d => d.isDirectory())
+    .map(dir => path.join(root, dir.name));
+
+  dirs.unshift(root);
+
+  dirs.forEach((dir) => {
+    deleteExists(dir);
+  });
+
+  const composerJsons = getInstalledComposerVendors()
+    .map((cv) => `vendor/${cv}/composer.json`)
+    .map((file) => loadJson(file))
+    .filter((composerJson) => composerJson?.extra?.windwalker != null);
+
+  // Install npm vendors
+  vendors = findNpmVendors(composerJsons).concat(vendors);
+  vendors = [...new Set(vendors)];
+
+  for (const vendor of vendors) {
+    const source = `node_modules/${vendor}/`;
+    if (fs.existsSync(source)) {
+      console.log(`[${action} NPM] node_modules/${vendor}/ => ${root}/${vendor}/`);
+      doInstall(source, `${root}/${vendor}/`);
+    }
+  }
+
+  // Install composer packages assets
+  for (const composerJson of composerJsons) {
+    const vendorName = composerJson.name;
+
+    let assets = composerJson?.extra?.windwalker?.assets?.link;
+
+    if (!assets) {
+      continue;
+    }
+
+    if (!assets.endsWith('/')) {
+      assets += '/';
+    }
+
+    if (fs.existsSync(`vendor/${vendorName}/${assets}`)) {
+      console.log(`[${action} Composer] vendor/${vendorName}/${assets} => ${root}/${vendorName}/`);
+      doInstall(`vendor/${vendorName}/${assets}`, `${root}/${vendorName}/`);
+    }
+  }
+
+  // Install legacy packages assets
+  // legacyComposerVendors.forEach((vendorName) => {
+  //   console.log(vendorName, fs.existsSync(`vendor/${vendorName}/assets`));
+  //   if (fs.existsSync(`vendor/${vendorName}/assets`)) {
+  //     console.log(`[${action} Composer] vendor/${vendorName}/assets/ => ${root}/${vendorName}/`);
+  //     doInstall(`vendor/${vendorName}/assets/`, `${root}/${vendorName}/`);
+  //   }
+  // });
+
+  // Install local saved vendors
+  const staticVendorDir = 'resources/assets/vendor/';
+
+  if (fs.existsSync(staticVendorDir)) {
+    const staticVendors = fs.readdirSync(staticVendorDir);
+
+    for (const staticVendor of staticVendors) {
+      if (staticVendor.startsWith('@')) {
+        const subVendors = fs.readdirSync(staticVendorDir + staticVendor);
+
+        for (const subVendor of subVendors) {
+          const subVendorName = staticVendor + '/' + subVendor;
+          const source = staticVendorDir + subVendorName + '/';
+
+          if (fs.existsSync(source)) {
+            console.log(`[${action} Local] resources/assets/vendor/${subVendorName}/ => ${root}/${subVendorName}/`);
+            doInstall(source, `${root}/${subVendorName}/`);
+          }
+        }
+      } else {
+        let source = staticVendorDir + staticVendor;
+
+        if (fs.existsSync(source)) {
+          console.log(`[${action} Local] resources/assets/vendor/${staticVendor}/ => ${root}/${staticVendor}/`);
+          doInstall(source, `${root}/${staticVendor}/`);
+        }
+      }
+    }
+  }
+}
+
+async function doInstall(source: string, dest: string) {
+  if (process.env.INSTALL_VENDOR === 'hard') {
+    await copyGlob(source + '/**/*', dest);
+  } else {
+    await symlink(source, dest);
+  }
+}
+
+function findNpmVendors(composerJsons: any[] = []) {
+  const pkg = path.resolve(process.cwd(), 'package.json');
+  const pkgJson = loadJson(pkg);
+
+  let vendors = Object.keys(pkgJson.devDependencies || {})
+    .concat(Object.keys(pkgJson.dependencies || {}))
+    .map(id => `node_modules/${id}/package.json`)
+    .map((file) => loadJson(file))
+    .filter(pkgJson => pkgJson?.windwalker != null)
+    .map(pkgJson => pkgJson?.windwalker.vendors || [])
+    .flat();
+
+  const vendorsFromComposer = composerJsons
+    .map((composerJson) => {
+      return [
+        ...composerJson?.extra?.windwalker?.asset_vendors || [],
+        ...composerJson?.extra?.windwalker?.assets?.exposes || [],
+        ...Object.keys(composerJson?.extra?.windwalker?.assets?.vendors || {})
+      ];
+    })
+    .flat();
+
+  return [...new Set(vendors.concat(vendorsFromComposer))];
+}
+
+function getInstalledComposerVendors() {
+  const composerFile = path.resolve(process.cwd(), 'composer.json');
+  const composerJson = loadJson(composerFile);
+
+  return [
+    ...new Set(
+      Object.keys(composerJson['require'] || {})
+        .concat(Object.keys(composerJson['require-dev'] || {}))
+    )
+  ];
+}
+
+function deleteExists(dir: string) {
+  if (!fs.existsSync(dir)) {
+    return;
+  }
+
+  const subDirs = fs.readdirSync(dir, { withFileTypes: true });
+
+  for (const subDir of subDirs) {
+    if (subDir.isSymbolicLink() || subDir.isFile()) {
+      fs.unlinkSync(path.join(dir, subDir.name));
+    } else if (subDir.isDirectory()) {
+      deleteExists(path.join(dir, subDir.name));
+    }
+  }
+
+  fs.rmdirSync(dir);
+}
+