lcd-router-webpack-plugin 1.0.0

package/lib/utils/types.d.ts

@@ -0,0 +1,75 @@
+export interface Options {
+    /**
+     * 组件上下文， 默认取 compiler.context
+     * @default compiler.context
+     */
+    context?: string;
+    /**
+     * 是否禁用内置路由
+     * 默认会将 react-router-dom 转换到 rrc-loader-helper/router
+     * 如果你是新项目，建议将该配置配置为true，因为内置路由针对react-router做了大量的改动，可能会引起一些无法预测的故障
+     * @default false
+     */
+    disableBuiltInRoute?: boolean;
+    /**
+     * 是否开启 webpack prefetch预加载
+     * @default false
+     */
+    enablePreFetch?: boolean;
+    /**
+     * 指定页面路径 不进行注册路由
+     * @default []
+     */
+    externals?: string[];
+    /**
+     * 页面目录
+     * @default component
+     */
+    pageDir: string;
+    /**
+     * shineout 主题
+     */
+    theme?: {
+        hash: string;
+    };
+    /**
+     * reducer 文件名称
+     * @default reducers
+     */
+    reducerName: string;
+    /**
+     * loading 组件路径
+     */
+    loading?: string;
+    /**
+     * 一个神奇的属性，用于处理 /xxx/order/list 这种路由过长的问题
+     * 也可以用来作为父路由的默认路由目录
+     * 会生成一个新路由 /xxx/order，实际目录指向为  /xxx/order/list
+     * @default list
+     */
+    index?: string;
+    /**
+     * 渲染出错时的组件地址
+     */
+    errorComponent?: string;
+    /**
+     * 是否允许页面内生成自定义路由
+     * 例如在 component/order/detail/me.json 中 配置  route: '/:id'，此时会生成动态路由 /order/detail/:id
+     * 非常不推荐使用的一个属性，因为此功能受 me.json 中 exact 属性影响， 仅当 exact: true 时候，才不会拼接路由
+     * 当开启 dangerousRoute 后， 不再受 exact 影响， 都会生成 拼接路由 /order/detail/:id
+     * @default false
+     */
+    dangerousRoute?: boolean;
+}
+export interface MeJSON {
+    theme?: string;
+    sync?: boolean;
+    mobx?: boolean;
+    keepAlive?: boolean;
+    retain?: boolean;
+    title?: string;
+    linkExtendable?: boolean;
+    injectStore?: boolean | string;
+    route?: string;
+}
+//# sourceMappingURL=types.d.ts.map

package/lib/utils/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/utils/types.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,OAAO;IACtB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;OAKG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;OAGG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB;;;OAGG;IACH,SAAS,CAAC,EAAE,MAAM,EAAE,CAAC;IACrB;;;OAGG;IACH,OAAO,EAAE,MAAM,CAAC;IAChB;;OAEG;IACH,KAAK,CAAC,EAAE;QACN,IAAI,EAAE,MAAM,CAAC;KACd,CAAC;IACF;;;OAGG;IACH,WAAW,EAAE,MAAM,CAAC;IACpB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;OAKG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;IACf;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;IAExB;;;;;;OAMG;IACH,cAAc,CAAC,EAAE,OAAO,CAAC;CAC1B;AAED,MAAM,WAAW,MAAM;IACrB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,MAAM,CAAC,EAAE,OAAO,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,WAAW,CAAC,EAAE,OAAO,GAAG,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB"}

package/lib/utils/types.js

@@ -0,0 +1,6 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+//# sourceMappingURL=types.js.map

package/lib/utils/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","names":[],"sources":["../../types.ts"],"sourcesContent":["export interface Options {\n  /**\n   * 组件上下文， 默认取 compiler.context\n   * @default compiler.context\n   */\n  context?: string;\n  /**\n   * 是否禁用内置路由\n   * 默认会将 react-router-dom 转换到 rrc-loader-helper/router\n   * 如果你是新项目，建议将该配置配置为true，因为内置路由针对react-router做了大量的改动，可能会引起一些无法预测的故障\n   * @default false\n   */\n  disableBuiltInRoute?: boolean;\n  /**\n   * 是否开启 webpack prefetch预加载\n   * @default false\n   */\n  enablePreFetch?: boolean;\n  /**\n   * 指定页面路径 不进行注册路由\n   * @default []\n   */\n  externals?: string[];\n  /**\n   * 页面目录\n   * @default component\n   */\n  pageDir: string;\n  /**\n   * shineout 主题\n   */\n  theme?: {\n    hash: string;\n  };\n  /**\n   * reducer 文件名称\n   * @default reducers\n   */\n  reducerName: string;\n  /**\n   * loading 组件路径\n   */\n  loading?: string;\n  /**\n   * 一个神奇的属性，用于处理 /xxx/order/list 这种路由过长的问题\n   * 也可以用来作为父路由的默认路由目录\n   * 会生成一个新路由 /xxx/order，实际目录指向为  /xxx/order/list\n   * @default list\n   */\n  index?: string;\n  /**\n   * 渲染出错时的组件地址\n   */\n  errorComponent?: string;\n\n  /**\n   * 是否允许页面内生成自定义路由\n   * 例如在 component/order/detail/me.json 中 配置  route: '/:id'，此时会生成动态路由 /order/detail/:id\n   * 非常不推荐使用的一个属性，因为此功能受 me.json 中 exact 属性影响， 仅当 exact: true 时候，才不会拼接路由\n   * 当开启 dangerousRoute 后， 不再受 exact 影响， 都会生成 拼接路由 /order/detail/:id\n   * @default false\n   */\n  dangerousRoute?: boolean;\n}\n\nexport interface MeJSON {\n  theme?: string;\n  sync?: boolean;\n  mobx?: boolean;\n  keepAlive?: boolean;\n  retain?: boolean;\n  title?: string;\n  linkExtendable?: boolean;\n  injectStore?: boolean | string;\n  route?: string;\n}\n"],"mappings":""}

package/package.json

@@ -0,0 +1,29 @@
+{
+  "name": "lcd-router-webpack-plugin",
+  "version": "1.0.0",
+  "description": "",
+  "main": "lib/index.js",
+  "keywords": [],
+  "author": "",
+  "license": "ISC",
+  "dependencies": {
+    "@babel/helper-plugin-utils": "7.19.0",
+    "chokidar": "3.5.1",
+    "deepmerge": "4.2.2",
+    "enhanced-resolve": "5.9.3",
+    "fs-extra": "10.0.0",
+    "globby": "11.1.0",
+    "string-format": "^2.0.0",
+    "sync-fetch": "0.5.2"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.23.0"
+  },
+  "peerDependencies": {
+    "webpack": ">=5"
+  },
+  "scripts": {
+    "build": "lecp",
+    "test": "echo \"Error: no test specified\" && exit 1"
+  }
+}

package/src/Generator.ts

@@ -0,0 +1,46 @@
+import { types } from '@babel/core';
+export class Generator<T> {
+  protected cache: Map<string, T>;
+  constructor() {
+    this.cache = new Map<string, T>();
+  }
+
+  set(name: string, value: T) {
+    this.cache.set(name, value);
+  }
+
+  protected identifierString(arg: string) {
+    return arg.replace(/(\/|-)/g, '_');
+  }
+
+  protected importDefaultDeclaration(name: string, source: string) {
+    return types.importDeclaration(
+      [types.importDefaultSpecifier(types.identifier(this.identifierString(name)))],
+      types.stringLiteral(source),
+    );
+  }
+
+  /**
+   * 创建一条 import 语句， 例如：
+   * importNamedDeclaration(['a', 'b'], 'xxx/c') 会生成 import {a, b} from 'xxx/c'
+   *
+   * 也支持 alias， 例如：
+   * importNamedDeclaration([['a', 'aliasName'], 'b'], 'xxx/c') 会生成 import {a as aliasName, b} from 'xxx/c'
+   */
+  protected importNamedDeclaration(
+    names: Array<string | [name: string, alias: string]>,
+    source: string,
+  ) {
+    return types.importDeclaration(
+      names.map((x) =>
+        typeof x === 'string'
+          ? types.importSpecifier(types.identifier(x), types.identifier(x))
+          : types.importSpecifier(
+              types.identifier(this.identifierString(x[1])),
+              types.identifier(x[0]),
+            ),
+      ),
+      types.stringLiteral(source),
+    );
+  }
+}

package/src/ReducersGenerator.ts

@@ -0,0 +1,90 @@
+import fs from 'fs';
+import babelCore, { transformSync, types } from '@babel/core';
+import type { MeJSON } from './utils';
+import { Generator } from './Generator';
+
+interface GetReducersBabelPluginItem {
+  meJSON: MeJSON;
+  namespace: string;
+  isExternal: boolean;
+  meJSONPath: string;
+}
+export class ReducersGenerator extends Generator<GetReducersBabelPluginItem> {
+  constructor() {
+    super();
+  }
+
+  // TODO: 这里类型 加了个 any， 不太希望写else， 所以导致的问题，ts类型推导似乎不合理
+  objectPropertyValue(type: 'call' | 'string' | 'identifier', value: string): any {
+    if (type === 'call') {
+      return types.callExpression(types.identifier('decorate'), [
+        types.identifier(this.identifierString(value)),
+        types.stringLiteral(value),
+      ]);
+    }
+    if (type === 'string') {
+      return types.stringLiteral('');
+    }
+    if (type === 'identifier') {
+      return types.identifier(this.identifierString(value));
+    }
+  }
+
+  writeCodeToFile(absPath: string) {
+    const items = Array.from(this.cache.values());
+    const code = transformSync('', {
+      plugins: [
+        () => {
+          return {
+            name: 'babel-plugin-replace-react-redux',
+            visitor: {
+              Program: {
+                enter: (path) => {
+                  const codes: (
+                    | babelCore.types.ImportDeclaration
+                    | babelCore.types.ExportDefaultDeclaration
+                  )[] = [
+                    this.importDefaultDeclaration(
+                      'decorate',
+                      'rrc-loader-helper/lib/reducer-decorate',
+                    ),
+                  ];
+                  items
+                    .filter((x) => x.meJSON.sync || x.isExternal)
+                    .map((x) =>
+                      this.importNamedDeclaration([['reducer', x.namespace]], x.meJSONPath),
+                    )
+                    .forEach((x) => codes.push(x));
+
+                  const properties = items.map((x) => {
+                    if (x.isExternal || x.meJSON.sync) {
+                      if (x.meJSON.mobx) {
+                        return types.objectProperty(
+                          types.stringLiteral(x.namespace),
+                          this.objectPropertyValue('call', x.namespace),
+                        );
+                      }
+                      return types.objectProperty(
+                        types.stringLiteral(x.namespace),
+                        this.objectPropertyValue('identifier', x.namespace),
+                      );
+                    }
+                    return types.objectProperty(
+                      types.stringLiteral(x.namespace),
+                      this.objectPropertyValue('string', x.namespace),
+                    );
+                  });
+
+                  codes.push(types.exportDefaultDeclaration(types.objectExpression(properties)));
+
+                  path.pushContainer('body', codes);
+                },
+              },
+            },
+          };
+        },
+      ],
+    });
+    fs.writeFileSync(absPath, code?.code!, { encoding: 'utf8' });
+  }
+}

package/src/RoutersGenerator.ts

@@ -0,0 +1,295 @@
+import fs from 'fs';
+import { transformSync, types } from '@babel/core';
+import type { Options, MeJSON, PathService } from './utils';
+import { Generator } from './Generator';
+
+interface Item {
+  meJSONPath: string;
+  meJSON: MeJSON;
+  isExternal: boolean;
+  path: string;
+  page: string;
+  exact: boolean;
+}
+
+interface TransformItem extends Item, MeJSON {}
+
+export class RoutersGenerator extends Generator<Item> {
+  config: Options;
+  pathService: PathService;
+
+  constructor(config: Options, pathService: PathService) {
+    super();
+    this.config = config;
+    this.pathService = pathService;
+  }
+
+  private errorComponentVariableDeclaration() {
+    return types.variableDeclaration('const', [
+      types.variableDeclarator(
+        types.identifier('ErrorComponent'),
+        types.arrowFunctionExpression(
+          [types.identifier('props')],
+          types.blockStatement([
+            types.returnStatement(
+              types.jsxElement(
+                types.jsxOpeningElement(types.jsxIdentifier('div'), [], false),
+                types.jsxClosingElement(types.jsxIdentifier('div')),
+                [
+                  types.jsxElement(
+                    types.jsxOpeningElement(types.jsxIdentifier('h1'), [], false),
+                    types.jsxClosingElement(types.jsxIdentifier('h1')),
+                    [types.jsxText('页面渲染发生异常')],
+                  ),
+                  types.jsxElement(
+                    types.jsxOpeningElement(types.jsxIdentifier('span'), [], false),
+                    types.jsxClosingElement(types.jsxIdentifier('span')),
+                    [
+                      types.jsxExpressionContainer(
+                        types.optionalMemberExpression(
+                          types.memberExpression(
+                            types.identifier('props'),
+                            types.identifier('errorStack'),
+                          ),
+                          types.identifier('message'),
+                          false,
+                          true,
+                        ),
+                      ),
+                    ],
+                  ),
+                ],
+                false,
+              ),
+            ),
+          ]),
+        ),
+      ),
+    ]);
+  }
+
+  private loadingVariableDeclaration() {
+    return types.variableDeclaration('const', [
+      types.variableDeclarator(
+        types.identifier('Loading'),
+        types.arrowFunctionExpression(
+          [],
+          types.blockStatement([
+            types.returnStatement(
+              types.jsxFragment(types.jsxOpeningFragment(), types.jsxClosingFragment(), []),
+            ),
+          ]),
+        ),
+      ),
+    ]);
+  }
+
+  private createDowngradeValue(meJSON: MeJSON) {
+    return <T extends keyof MeJSON>(name: T, defaultValue: MeJSON[T]) => {
+      /** @ts-ignore */
+      return meJSON[name] ?? this.config[name] ?? defaultValue;
+    };
+  }
+
+  private transform(item: Item): TransformItem {
+    const downgradeValue = this.createDowngradeValue(item.meJSON);
+    // 路由参数
+    let route = item.meJSON.route ?? '';
+    const keepAlive = downgradeValue('keepAlive', false);
+    const retain = downgradeValue('retain', false);
+    const title = downgradeValue('title', undefined);
+    // FUCK keep-alive 特性的坑， 为了兼容同一个页面多次打开 动态拓展 redux 的reducer 节点
+    const linkExtendable = downgradeValue('linkExtendable', false);
+    route = linkExtendable ? `${route}/:id?` : route;
+    let injectStore = downgradeValue('injectStore', false);
+    if (injectStore === true) injectStore = 'store';
+    return {
+      ...item,
+      route,
+      keepAlive,
+      retain,
+      title,
+      linkExtendable,
+      injectStore,
+    };
+  }
+
+  private pageImportExpression(item: TransformItem) {
+    const returnObjectProperties = [
+      types.objectProperty(types.identifier('module'), types.identifier('module')),
+    ];
+    if (item.meJSON.sync) {
+      returnObjectProperties.push(
+        types.objectProperty(types.identifier('sync'), types.booleanLiteral(true)),
+      );
+    } else {
+      returnObjectProperties.push(
+        types.objectProperty(types.identifier('sync'), types.booleanLiteral(false)),
+        types.objectProperty(types.identifier('reducers'), types.identifier('reducers')),
+      );
+    }
+    const sourceAst = types.stringLiteral(item.meJSONPath);
+
+    if (this.config.enablePreFetch) {
+      types.addComment(sourceAst, 'leading', 'webpackPrefetch: true');
+    }
+
+    return types.callExpression(
+      types.memberExpression(
+        types.callExpression(types.import(), [sourceAst]),
+        types.identifier('then'),
+      ),
+      [
+        types.arrowFunctionExpression(
+          [types.identifier('module')],
+          types.blockStatement([
+            // TODO
+            types.returnStatement(types.objectExpression(returnObjectProperties)),
+          ]),
+        ),
+      ],
+    );
+  }
+
+  private loadableCallExpression(item: TransformItem) {
+    return types.callExpression(types.identifier('Loadable'), [
+      types.objectExpression([
+        types.objectProperty(
+          types.identifier('title'),
+          item.title ? types.stringLiteral(item.title) : types.nullLiteral(),
+        ),
+        types.objectProperty(types.identifier('keepAlive'), types.booleanLiteral(item.keepAlive!)),
+        types.objectProperty(types.identifier('route'), types.stringLiteral(item.route!)),
+        types.objectProperty(types.identifier('retain'), types.booleanLiteral(item.retain!)),
+        types.objectProperty(
+          types.identifier('injectStore'),
+          typeof item.injectStore === 'boolean'
+            ? types.booleanLiteral(item.injectStore)
+            : types.stringLiteral(item.injectStore!),
+        ),
+        types.objectProperty(types.identifier('page'), types.stringLiteral(item.page)),
+        types.objectProperty(types.identifier('loading'), types.identifier('Loading')),
+        types.objectProperty(
+          types.identifier('errorComponent'),
+          types.identifier('ErrorComponent'),
+        ),
+        types.objectProperty(
+          types.identifier('metaInfo'),
+          types.callExpression(
+            types.memberExpression(types.identifier('JSON'), types.identifier('parse')),
+            [types.stringLiteral(JSON.stringify(item.meJSON))],
+          ),
+        ),
+        types.objectProperty(
+          types.identifier('loader'),
+          types.arrowFunctionExpression([], this.pageImportExpression(item)),
+        ),
+      ]),
+    ]);
+  }
+
+  writeCodeToFile(absPath: string) {
+    const items = Array.from(this.cache.values());
+    const code = transformSync('', {
+      plugins: [
+        () => {
+          return {
+            name: 'babel-plugin-replace-react-redux',
+            visitor: {
+              Program: {
+                enter: (path) => {
+                  const ast: (
+                    | types.ImportDeclaration
+                    | types.VariableDeclaration
+                    | types.ExportDefaultDeclaration
+                    | types.ExpressionStatement
+                  )[] = [
+                    this.importNamedDeclaration([], 'rrc-loader-helper/lib/fake-react'),
+                    this.importDefaultDeclaration('Loadable', 'rrc-loader-helper/lib/loadable'),
+                    this.importDefaultDeclaration('React', 'react'),
+                  ];
+
+                  /** 如果用户没有指定loading组件，那么自动生成一个空 loading */
+                  if (this.config.loading) {
+                    ast.push(this.importDefaultDeclaration('Loading', this.config.loading));
+                  } else {
+                    ast.push(this.loadingVariableDeclaration());
+                  }
+
+                  if (this.config.errorComponent) {
+                    ast.push(
+                      this.importDefaultDeclaration('ErrorComponent', this.config.errorComponent),
+                    );
+                  } else {
+                    ast.push(this.errorComponentVariableDeclaration());
+                  }
+
+                  if (this.config.theme?.hash) {
+                    ast.push(
+                      this.importNamedDeclaration(
+                        ['toGlobalTheme'],
+                        this.pathService.getThemeJSCacheFileAbs(this.config.theme?.hash),
+                      ),
+                    );
+                    ast.push(
+                      types.expressionStatement(
+                        types.optionalCallExpression(types.identifier('toGlobalTheme'), [], true),
+                      ),
+                    );
+                  }
+
+                  const _ = items
+                    .filter((x) => !x.isExternal)
+                    .map((x) => this.transform(x))
+                    .map((x) => {
+                      const path =
+                        this.config.dangerousRoute || !x.exact
+                          ? `/${x.path}${x.route}`
+                          : `/${x.path}`;
+                      return types.objectExpression([
+                        types.objectProperty(
+                          types.identifier('exact'),
+                          types.booleanLiteral(x.exact),
+                        ),
+                        types.objectProperty(
+                          types.identifier('keepAlive'),
+                          types.booleanLiteral(x.keepAlive!),
+                        ),
+                        types.objectProperty(types.identifier('key'), types.stringLiteral(path)),
+                        types.objectProperty(types.identifier('path'), types.stringLiteral(path)),
+                        types.objectProperty(
+                          types.identifier('component'),
+                          this.loadableCallExpression(x),
+                        ),
+                      ]);
+                    });
+                  ast.push(
+                    types.exportDefaultDeclaration(
+                      types.arrowFunctionExpression(
+                        [types.identifier('reducers')],
+                        types.blockStatement([types.returnStatement(types.arrayExpression(_))]),
+                      ),
+                    ),
+                  );
+
+                  path.pushContainer('body', ast);
+                },
+              },
+            },
+          };
+        },
+      ],
+    });
+
+    fs.writeFileSync(
+      absPath,
+      [
+        JSON.stringify(`👹 pages total count is ${Array.from(this.cache.keys()).length}`),
+        code?.code!,
+      ].join(';\r\n'),
+      {
+        encoding: 'utf8',
+      },
+    );
+  }
+}

package/src/SagasGenerator.ts

@@ -0,0 +1,101 @@
+import { Generator } from './Generator';
+import type { MeJSON } from './utils';
+import { transformSync, types } from '@babel/core';
+import fs from 'fs';
+interface Item {
+  namespace: string;
+  meJSONPath: string;
+  isExternal: boolean;
+  meJSON: MeJSON;
+}
+export class SagasGenerator extends Generator<Item> {
+  constructor() {
+    super();
+  }
+
+  private setCtxExpressionStatement(namespace: string) {
+    return types.expressionStatement(
+      types.yieldExpression(
+        types.callExpression(types.identifier('setCtx'), [
+          types.objectExpression([
+            types.objectProperty(types.identifier('mobxStyle'), types.booleanLiteral(true)),
+            types.objectProperty(types.identifier('page'), types.stringLiteral(namespace)),
+            types.objectProperty(types.identifier('url'), types.stringLiteral('')),
+          ]),
+        ]),
+      ),
+    );
+  }
+
+  private callExpressionStatement(namespace: string) {
+    return types.expressionStatement(
+      types.yieldExpression(
+        types.callExpression(types.identifier('call'), [
+          types.memberExpression(
+            types.identifier(this.identifierString(namespace)),
+            types.identifier('saga'),
+          ),
+        ]),
+      ),
+    );
+  }
+
+  writeCodeToFile(absPath: string) {
+    const items = Array.from(this.cache.values());
+    const code = transformSync('', {
+      plugins: [
+        () => {
+          return {
+            visitor: {
+              Program: {
+                enter: (path) => {
+                  const ast: (types.ImportDeclaration | types.ExportDefaultDeclaration)[] = [
+                    this.importNamedDeclaration(['setCtx'], 'rrc-loader-helper/lib/retain'),
+                    this.importNamedDeclaration(
+                      ['call'],
+                      'rrc-loader-helper/lib/sagas/redux-saga/effects',
+                    ),
+                  ];
+
+                  items
+                    .filter((x) => x.meJSON.sync || x.isExternal)
+                    .forEach((x) =>
+                      // 如果是mobx， 取 reducer， 否则取 saga
+                      ast.push(
+                        this.importNamedDeclaration(
+                          [[x.meJSON.mobx ? 'reducer' : 'saga', x.namespace]],
+                          x.meJSONPath,
+                        ),
+                      ),
+                    );
+
+                  const arrayItem = items.map((x) => {
+                    if (!x.isExternal && !x.meJSON.sync) {
+                      return types.stringLiteral('');
+                    }
+                    if (x.meJSON.mobx) {
+                      return types.functionExpression(
+                        null,
+                        [],
+                        types.blockStatement([
+                          this.setCtxExpressionStatement(x.namespace),
+                          this.callExpressionStatement(x.namespace),
+                        ]),
+                        true,
+                        false,
+                      );
+                    }
+                    return types.identifier(this.identifierString(x.namespace));
+                  });
+                  ast.push(types.exportDefaultDeclaration(types.arrayExpression(arrayItem)));
+                  path.pushContainer('body', ast);
+                },
+              },
+            },
+          };
+        },
+      ],
+    });
+    fs.writeFileSync(absPath, code?.code!, { encoding: 'utf8' });
+  }
+}