@ray-js/builder-mp 0.3.0-beta.1c347991

package/lib/Builder.d.ts

@@ -0,0 +1,11 @@
+import { Entry } from 'webpack';
+import { CliOptions } from '@ray-js/types';
+export default class Builder {
+    private cliOptions;
+    private entryValue;
+    get options(): CliOptions;
+    set options(v: CliOptions);
+    get entry(): Entry;
+    set entry(v: Entry);
+}
+export declare const builder: Builder;

package/lib/Builder.js

@@ -0,0 +1,22 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.builder = void 0;
+class Builder {
+    constructor() {
+        this.entryValue = {};
+    }
+    get options() {
+        return this.cliOptions;
+    }
+    set options(v) {
+        this.cliOptions = v;
+    }
+    get entry() {
+        return this.entryValue;
+    }
+    set entry(v) {
+        this.entryValue = v;
+    }
+}
+exports.default = Builder;
+exports.builder = new Builder();

package/lib/babel-plugins/ray-hooks/index.d.ts

@@ -0,0 +1,14 @@
+/**
+ * 1. 替换 usePageEvent 到 @remax/macro
+ */
+import { NodePath } from '@babel/traverse';
+import * as t from '@babel/types';
+/**
+ * web 构建模式加, 替换到 ray 的运行时 API
+ * @constructor
+ */
+export default function RayHooks(): {
+    visitor: {
+        ImportSpecifier(path: NodePath<t.ImportSpecifier>, state: any): void;
+    };
+};

package/lib/babel-plugins/ray-hooks/index.js

@@ -0,0 +1,63 @@
+"use strict";
+/**
+ * 1. 替换 usePageEvent 到 @remax/macro
+ */
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const t = __importStar(require("@babel/types"));
+function insertImport(program, imports, moduleName) {
+    const specifiers = imports.map((i) => t.importSpecifier(t.identifier(i), t.identifier(i)));
+    const importDeclaration = t.importDeclaration(specifiers, t.stringLiteral(moduleName));
+    program.unshiftContainer('body', importDeclaration);
+}
+/**
+ * web 构建模式加, 替换到 ray 的运行时 API
+ * @constructor
+ */
+function RayHooks() {
+    return {
+        visitor: {
+            ImportSpecifier(path, state) {
+                const program = state.file.path;
+                const { node } = path;
+                const name = node.local.name;
+                if (['usePageEvent', 'useAppEvent'].includes(name) &&
+                    t.isImportDeclaration(path.parentPath)) {
+                    const { node } = path.parentPath;
+                    if (node.source.value === 'ray') {
+                        if (node.specifiers.length > 1) {
+                            path.remove();
+                            insertImport(program, [name], `@remax/macro`);
+                        }
+                        else {
+                            node.source.value = '@remax/macro';
+                        }
+                    }
+                }
+            },
+        },
+    };
+}
+exports.default = RayHooks;

package/lib/babel-plugins/ray-page-context/__fixtures__/page-anonymous-fn/code.config.d.ts

@@ -0,0 +1,3 @@
+export declare const wechat: {
+    a: number;
+};

package/lib/babel-plugins/ray-page-context/__fixtures__/page-anonymous-fn/code.config.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wechat = void 0;
+exports.wechat = {
+    a: 1,
+};

package/lib/babel-plugins/ray-page-context/__fixtures__/page-fn/code.config.d.ts

@@ -0,0 +1,3 @@
+export declare const wechat: {
+    a: number;
+};

package/lib/babel-plugins/ray-page-context/__fixtures__/page-fn/code.config.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wechat = void 0;
+exports.wechat = {
+    a: 1,
+};

package/lib/babel-plugins/ray-page-context/__fixtures__/page-instance/code.config.d.ts

@@ -0,0 +1,3 @@
+export declare const wechat: {
+    a: number;
+};

package/lib/babel-plugins/ray-page-context/__fixtures__/page-instance/code.config.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wechat = void 0;
+exports.wechat = {
+    a: 1,
+};

package/lib/babel-plugins/ray-page-context/__fixtures__/single/code.config.d.ts

@@ -0,0 +1,3 @@
+export declare const wechat: {
+    config: number;
+};

package/lib/babel-plugins/ray-page-context/__fixtures__/single/code.config.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wechat = void 0;
+exports.wechat = {
+    config: 1,
+};

package/lib/babel-plugins/ray-page-context/app.config.d.ts

@@ -0,0 +1,3 @@
+export declare const wechat: {
+    app: number;
+};

package/lib/babel-plugins/ray-page-context/app.config.js

@@ -0,0 +1,6 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.wechat = void 0;
+exports.wechat = {
+    app: 1,
+};

package/lib/babel-plugins/ray-page-context/index.d.ts

@@ -0,0 +1,17 @@
+import { NodePath } from '@babel/traverse';
+import * as t from '@babel/types';
+/**
+ * 1. 增加小程序运行时 context appConfig pageConfig 的导入, 并共享到 PageInstanceContext 上
+ * 2. 或增加 withPage 的依赖项
+ * 3. 早于  ray-hooks 执行
+ * @param _ babel
+ * @param options compileOptions
+ * @constructor
+ */
+export default function ContextAndHoc(): {
+    pre(state: any): void;
+    visitor: {
+        ExportDefaultDeclaration(path: NodePath<t.ExportDefaultDeclaration>, state: any): void;
+    };
+    post(state: any): void;
+};

package/lib/babel-plugins/ray-page-context/index.js

@@ -0,0 +1,258 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const change_case_1 = require("change-case");
+const fs_1 = __importDefault(require("fs"));
+const P = __importStar(require("path"));
+const slash_1 = __importDefault(require("slash"));
+const template_1 = __importDefault(require("@babel/template"));
+const t = __importStar(require("@babel/types"));
+const shared_1 = require("@ray-js/shared");
+const Builder_1 = require("../../Builder");
+function insertSpecifierImport(program, imports, moduleName) {
+    const specifiers = imports.map((i) => t.importSpecifier(t.identifier(i), t.identifier(i)));
+    const importDeclaration = t.importDeclaration(specifiers, t.stringLiteral(moduleName));
+    program.unshiftContainer('body', importDeclaration);
+}
+const contextTemplate = (0, template_1.default)(`const id = forwardRef((props, ref) => {
+  const isClassType = (c) => c.prototype && typeof c.prototype.render === 'function';
+  const $instance = new PageInstance();
+  usePageEvent('onLoad', () => {
+    lifecycle.addInstance($instance);
+    lifecycle.emit({ name: 'onLoad', uniqueId: $instance.uniqueId })
+  });
+  usePageEvent('onUnload', () => {
+    lifecycle.emit({ name: 'onUnload', uniqueId: $instance.uniqueId })
+    lifecycle.removeInstance($instance);
+  });
+  usePageEvent('onShow', () => {
+    lifecycle.emit({ name: 'onShow', uniqueId: $instance.uniqueId })
+  });
+  return (
+    <PageInstanceContext.Provider value={{
+        $instance: $instance,
+      }}
+    >
+      {isClassType(compName) ? <compTag ref={ref} {...props}/> : <compTag {...props}/> }
+    </PageInstanceContext.Provider>
+  );
+});`, {
+    plugins: ['jsx'],
+    syntacticPlaceholders: false,
+    placeholderWhitelist: new Set(['id', 'compTag', 'compName', 'platform']),
+    placeholderPattern: false,
+});
+const pageConfigTemplate = (0, template_1.default)(`const __pageConfig = require("file");
+   const __pageConfigData = __pageConfig.platform ? {...__pageConfig.platform} : __pageConfig.default ? {...__pageConfig.default} : {}
+`, {
+    syntacticPlaceholders: false,
+    placeholderWhitelist: new Set(['file', 'platform']),
+    placeholderPattern: false,
+});
+const appConfigTemplate = (0, template_1.default)(`import __appConfig from 'file';
+const __appConfigData = __appConfig.platform || __appConfig || {};
+`, {
+    syntacticPlaceholders: false,
+    placeholderWhitelist: new Set(['file', 'platform']),
+    placeholderPattern: false,
+});
+function insertPageConfig(program, filename) {
+    const pageDir = P.dirname(filename);
+    const importBasename = P.basename(filename, P.extname(filename));
+    const pageConfigPath = (0, shared_1.searchJSFile)(`${importBasename}.config`, {
+        cwd: pageDir,
+    });
+    if (fs_1.default.existsSync(pageConfigPath)) {
+        const file = (0, shared_1.replaceExtension)(`./${P.relative(pageDir, pageConfigPath)}`);
+        const ast = pageConfigTemplate({
+            file: t.stringLiteral(file),
+            platform: t.identifier(process.env.PLATFORM),
+        });
+        program.unshiftContainer('body', ast);
+    }
+    else {
+        program.unshiftContainer('body', t.variableDeclaration('const', [
+            t.variableDeclarator(t.identifier('__pageConfigData'), t.objectExpression([])),
+        ]));
+    }
+    return true;
+}
+function insertAppConfig(program, filename) {
+    const pageDir = P.dirname(filename);
+    const sourceDir = P.join(Builder_1.builder.options.cwd, Builder_1.builder.options.source);
+    const appConfigPath = (0, shared_1.searchJSFile)('app.config', {
+        cwd: sourceDir,
+    });
+    if (fs_1.default.existsSync(appConfigPath)) {
+        const file = (0, shared_1.replaceExtension)(P.relative(pageDir, appConfigPath));
+        const ast = appConfigTemplate({
+            file: t.stringLiteral(file),
+            platform: t.identifier(process.env.PLATFORM),
+        });
+        program.unshiftContainer('body', ast);
+    }
+    else {
+        program.unshiftContainer('body', t.variableDeclaration('const', [
+            t.variableDeclarator(t.identifier('__appConfigData'), t.objectExpression([])),
+        ]));
+    }
+    return true;
+}
+let appConfig = null;
+function getAppConfig() {
+    if (appConfig)
+        return appConfig;
+    const sourceDir = P.join(Builder_1.builder.options.cwd, Builder_1.builder.options.source);
+    const appConfigPath = (0, shared_1.searchJSFile)('app.config', {
+        cwd: sourceDir,
+    });
+    if (fs_1.default.existsSync(appConfigPath)) {
+        appConfig = require(appConfigPath);
+    }
+    return appConfig || { pageWrapper: '' };
+}
+const { target } = Builder_1.builder.options;
+const { [target]: { pageWrapper }, } = getAppConfig();
+/**
+ * 1. 增加小程序运行时 context appConfig pageConfig 的导入, 并共享到 PageInstanceContext 上
+ * 2. 或增加 withPage 的依赖项
+ * 3. 早于  ray-hooks 执行
+ * @param _ babel
+ * @param options compileOptions
+ * @constructor
+ */
+function ContextAndHoc() {
+    let entries = [];
+    let isPage;
+    let exportDefaultDeclarationName;
+    return {
+        pre(state) {
+            exportDefaultDeclarationName = '';
+            entries = Object.keys(Builder_1.builder.entry);
+            const sourceDir = (0, slash_1.default)(P.join(Builder_1.builder.options.cwd, Builder_1.builder.options.source));
+            const filename = (0, slash_1.default)(state.opts.filename);
+            const fileName = P.relative(sourceDir, filename);
+            const fileEntryName = fileName.replace(P.extname(fileName), '');
+            isPage = fileEntryName.toLowerCase() !== 'app' && entries.some((e) => e === fileEntryName);
+        },
+        visitor: {
+            ExportDefaultDeclaration(path, state) {
+                if (!isPage)
+                    return;
+                const { node } = path;
+                const program = state.file.path;
+                const importer = state.filename;
+                if (pageWrapper && pageWrapper.length) {
+                    insertPageConfig(program, importer);
+                    if (typeof pageWrapper === 'string') {
+                        insertSpecifierImport(program, ['default as RayPageWrapper'], pageWrapper);
+                    }
+                    else {
+                        let i = 0;
+                        pageWrapper.forEach((element) => {
+                            insertSpecifierImport(program, [`default as RayPageWrapper${i++}`], element);
+                        });
+                    }
+                }
+                // 导出的引用是一个 FunctionComponent 才进行运行时包裹
+                let pageName = 'default';
+                if (t.isIdentifier(node.declaration)) {
+                    pageName = node.declaration.name;
+                    path.remove();
+                }
+                else if (t.isFunctionDeclaration(node.declaration)) {
+                    if (node.declaration.id) {
+                        pageName = node.declaration.id.name;
+                    }
+                    else {
+                        const [_, n] = importer.split(P.sep).reverse();
+                        pageName = path.scope.generateUid((0, change_case_1.pascalCase)(n));
+                    }
+                    const pageFn = t.functionExpression(t.identifier(pageName), node.declaration.params, node.declaration.body);
+                    path.replaceWith(t.variableDeclaration('const', [t.variableDeclarator(t.identifier(pageName), pageFn)]));
+                }
+                else if (t.isClassDeclaration(node.declaration)) {
+                    if (node.declaration.id) {
+                        pageName = node.declaration.id.name;
+                        path.replaceWith(node.declaration);
+                    }
+                    else {
+                        const [_, n] = importer.split(P.sep).reverse();
+                        pageName = path.scope.generateUid((0, change_case_1.pascalCase)(n));
+                        path.replaceWith(t.classDeclaration(t.identifier(pageName), node.declaration.superClass, node.declaration.body, node.declaration.decorators));
+                    }
+                }
+                else {
+                    pageName = path.scope.generateUid(pageName);
+                    path.replaceWith(t.variableDeclaration('const', [
+                        // @ts-ignore
+                        t.variableDeclarator(t.identifier(pageName), node.declaration),
+                    ]));
+                }
+                const id = path.scope.generateUid(pageName);
+                const ast = contextTemplate({
+                    id: t.identifier(id),
+                    compTag: t.jsxIdentifier(pageName),
+                    compName: t.identifier(pageName),
+                });
+                if (pageWrapper && pageWrapper.length) {
+                    if (typeof pageWrapper === 'string') {
+                        exportDefaultDeclarationName = `RayPageWrapper(${id}, __pageConfigData);`;
+                    }
+                    else {
+                        let ename = id;
+                        for (let i = 0; i < pageWrapper.length; i++) {
+                            ename = `RayPageWrapper${i}(` + ename + ', __pageConfigData)';
+                        }
+                        ename += ';';
+                        exportDefaultDeclarationName = ename;
+                    }
+                }
+                else {
+                    exportDefaultDeclarationName = id;
+                }
+                program.pushContainer('body', ast);
+                const rayImportSpecifiers = ['PageInstanceContext', 'PageInstance', 'lifecycle'];
+                ['usePageEvent', 'router', 'location'].forEach((key) => {
+                    if (!path.scope.hasBinding(key)) {
+                        rayImportSpecifiers.push(key);
+                    }
+                });
+                insertSpecifierImport(program, rayImportSpecifiers, 'ray');
+                insertSpecifierImport(program, ['forwardRef'], 'react');
+            },
+        },
+        post(state) {
+            const program = state.path;
+            if (exportDefaultDeclarationName) {
+                program.pushContainer('body', t.exportDefaultDeclaration(t.identifier(exportDefaultDeclarationName)));
+            }
+        },
+    };
+}
+exports.default = ContextAndHoc;

package/lib/build.d.ts

@@ -0,0 +1,5 @@
+import webpack from 'webpack';
+import { API, CliOptions } from '@ray-js/types';
+export default function build(options: CliOptions, context: {
+    api: API;
+}): Promise<webpack.Compiler>;

package/lib/build.js

@@ -0,0 +1,224 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const colors_1 = __importDefault(require("colors"));
+const path_1 = __importDefault(require("path"));
+const pretty_bytes_1 = __importDefault(require("pretty-bytes"));
+const webpack_1 = __importDefault(require("webpack"));
+const shared_1 = require("@ray-js/shared");
+const build_store_1 = __importDefault(require("@remax/build-store"));
+const API_1 = __importDefault(require("@remax/cli/lib/API"));
+const legacyExport_1 = require("@remax/cli/lib/legacyExport");
+const package_json_1 = __importDefault(require("@remax/cli/package.json"));
+const Builder_1 = require("./Builder");
+const AppFrameworkEntry_1 = __importDefault(require("./webpack-plugins/AppFrameworkEntry"));
+colors_1.default.enable();
+const LOG_PREFIX = 'builder-mp';
+function build(options, context) {
+    return __awaiter(this, void 0, void 0, function* () {
+        const { api } = context;
+        const compileOptions = Object.assign({
+            cwd: process.cwd(),
+            source: 'src',
+            mode: 'development',
+            watch: false,
+            target: 'wechat',
+            mini: false,
+            analyze: false,
+            devtools: false,
+            debug: false,
+            output: 'dist',
+        }, options);
+        shared_1.log.verbose(LOG_PREFIX, `compileOptions:`, compileOptions);
+        const { cwd, source, mode, watch, target, mini, analyze, debug, output, devtools } = compileOptions;
+        // 上下文共享 options
+        Builder_1.builder.options = compileOptions;
+        process.env.NODE_ENV = mode;
+        process.env.PLATFORM = target;
+        process.env.TUYA_DEVTOOLS = JSON.stringify(devtools);
+        process.env.REMAX_PLATFORM = target; // remax-one 依赖此环境变量
+        if (debug) {
+            process.env.REMAX_DEBUG = 'true'; // remax 运行时日志
+        }
+        const outputPath = (0, shared_1.resolvePath)([output, target], { cwd });
+        shared_1.log.info(LOG_PREFIX, '@remax/cli:'.green, `v${package_json_1.default.version}`);
+        shared_1.log.info(LOG_PREFIX, 'cwd:'.green, cwd.underline);
+        shared_1.log.info(LOG_PREFIX, 'outputDir:'.green, outputPath.underline);
+        devtools &&
+            shared_1.log.info(LOG_PREFIX, '开启 devtools 开发者工具环境变量'.yellow, 'process.evn.TUYA_DEVTOOLS');
+        const _a = (0, legacyExport_1.getDefaultOptions)(), { UNSAFE_wechatTemplateDepth } = _a, remaxDefaultOptions = __rest(_a, ["UNSAFE_wechatTemplateDepth"]);
+        const remaxBuildConfig = Object.assign(Object.assign({}, remaxDefaultOptions), { UNSAFE_wechatTemplateDepth: Object.assign(UNSAFE_wechatTemplateDepth, {
+                swiper: 3,
+                text: 1,
+                ad: -1,
+                'match-media': -1,
+                'page-container': -1,
+                'share-element': -1,
+                'keyboard-accessory': -1,
+                'voip-room': -1,
+                'ad-custom': -1,
+                'page-meta': -1,
+                'navigation-bar': -1,
+            }), compressTemplate: mini, pxToRpx: false, minimize: mini, analyze,
+            cwd, loglevel: 'warn', rootDir: source, 
+            // @ts-ignore
+            target: target, output: path_1.default.relative(cwd, outputPath), watch,
+            configWebpack(context) {
+                const { config, addCSSRule } = context;
+                // config.optimization.clear();
+                addCSSRule({
+                    name: 'less',
+                    test: /\.less(\?.*)?$/,
+                    loader: require.resolve('less-loader'),
+                    options: {},
+                });
+                const appFile = api.searchJSFile('src/app');
+                shared_1.log.verbose('appFile', appFile);
+                config.plugin('app-framework-entry').use(AppFrameworkEntry_1.default, [appFile]);
+                // 删除 clean-webpack-plugin 插件
+                config.plugins.delete('clean-webpack-plugin');
+                // 修改 mini-css-extract-plugin 的配置
+                config.plugin('mini-css-extract-plugin').tap(([options]) => {
+                    return [Object.assign(Object.assign({}, options), { ignoreOrder: true })];
+                });
+                // 收敛 babel.config 配置
+                // 调整 remax 的 babel 配置
+                const babelConfigFile = path_1.default.resolve(__dirname, './configs/babel.config.js');
+                config.module
+                    .rule('js')
+                    // 此次使用的 loader 是走了 remax 自定义的 babel
+                    // @see https://github.com/remaxjs/remax/blob/87d114dc33690c09202054a2fa3fc9b770455935/packages/remax-cli/src/build/webpack/config.mini.ts#L122
+                    .use('babel')
+                    .tap((options) => {
+                    return Object.assign(Object.assign({}, options), { configFile: babelConfigFile });
+                })
+                    .end();
+                // 替换 usePageEvent useAppEvent hooks api 模块名
+                config.module
+                    .rule('ray-hooks')
+                    .test(/\.(js|ts)x?$/)
+                    .exclude.add(/node_modules\/(react|react-reconciler|react-dom)/)
+                    .end()
+                    .pre()
+                    .use('hooks-loader')
+                    .loader(require.resolve('babel-loader'))
+                    .options({
+                    babelrc: false,
+                    presets: ['@babel/preset-typescript'],
+                    plugins: [
+                        [require.resolve('./babel-plugins/ray-hooks/index')],
+                        '@babel/plugin-syntax-jsx',
+                    ],
+                })
+                    .end()
+                    .use('env-loader')
+                    .loader(require.resolve('@ray-js/env-loader'))
+                    .options({ platform: target })
+                    .end();
+                // 对项目下的文件进行 context 实例的包裹
+                // 透传如 pageConfig appConfig
+                config.module
+                    .rule('ray-context')
+                    .test(/\.(js|ts)x?$/)
+                    .include.add(path_1.default.join(Builder_1.builder.options.cwd, Builder_1.builder.options.source))
+                    .end()
+                    .pre()
+                    .use('context-loader')
+                    .loader(require.resolve('babel-loader'))
+                    .options({
+                    babelrc: false,
+                    presets: ['@babel/preset-typescript'],
+                    plugins: [
+                        [require.resolve('./babel-plugins/ray-page-context/index'), Builder_1.builder.options],
+                        '@babel/plugin-syntax-jsx',
+                        [
+                            '@babel/plugin-proposal-decorators',
+                            {
+                                legacy: true,
+                            },
+                        ],
+                    ],
+                })
+                    .end();
+                config.plugin('defined').use(webpack_1.default.DefinePlugin, [
+                    {
+                        'process.env.NODE_ENV': JSON.stringify(mode),
+                        'process.env.PLATFORM': JSON.stringify(target),
+                        'process.env.REMAX_PLATFORM': JSON.stringify(target),
+                    },
+                ]);
+                config.resolve.alias.set('remax', path_1.default.dirname(require.resolve('remax/package.json')));
+                config.resolve.alias.set('@remax/runtime', path_1.default.dirname(require.resolve('@remax/runtime/package.json')));
+                config.resolve.alias.set('react', path_1.default.dirname(require.resolve('react/package.json')));
+                config.resolve.alias.set('@ray-js/router', '@ray-js/router-mp');
+                config.resolve.alias.set('@ray-js/framework', '@ray-js/framework-mp');
+                // @remax/plugin-error-screen 使用到的 @remax one
+                config.resolve.alias.set('@remax/one', path_1.default.dirname(require.resolve('@ray-js/components/package.json')));
+                api.configIntoWebpackConfig(config);
+                api.callPluginMethod('configWebpack', { config });
+                Builder_1.builder.entry = config.toConfig().entry;
+            } });
+        const remaxApi = new API_1.default();
+        const originalRemax = remaxApi.registerAdapterPlugins;
+        // FIXME: remax 支持注册其他平台适配器
+        remaxApi.registerAdapterPlugins = function (target) {
+            // @ts-ignore
+            if (target === 'tuya') {
+                this.adapter.target = target;
+                this.adapter.packageName = '@ray-js/remax-tuya';
+                const packagePath = this.adapter.packageName + '/node';
+                let plugin = require(packagePath).default || require(packagePath);
+                plugin = typeof plugin === 'function' ? plugin() : plugin;
+                build_store_1.default.skipHostComponents = plugin.skipHostComponents;
+                // @ts-ignore
+                this.registerHostComponents(plugin.hostComponents);
+                this.plugins.push(plugin);
+            }
+            else {
+                originalRemax.call(this, target);
+            }
+        };
+        const compiler = (0, legacyExport_1.buildMini)(remaxApi, Object.assign({}, remaxBuildConfig));
+        compiler.hooks.done.tap('tuya-scripts', (stats) => {
+            var _a;
+            const json = stats.toJson();
+            const size = (_a = json.assets) === null || _a === void 0 ? void 0 : _a.reduce((acc, asset) => {
+                return acc + asset.size;
+            }, 0);
+            console.log(stats.toString({
+                colors: true,
+                entrypoints: false,
+                assets: watch ? false : true,
+                children: false,
+                modules: false,
+            }));
+            console.log('');
+            shared_1.log.info(LOG_PREFIX, `Output size ${size} bytes`.yellow, (0, pretty_bytes_1.default)(size).bgMagenta.white);
+            console.log('');
+        });
+        return compiler;
+    });
+}
+exports.default = build;

package/lib/configs/babel.config.d.ts

@@ -0,0 +1,12 @@
+export default function babelConfig(api: any): {
+    presets: (string | {
+        typescript: boolean;
+        decorators: {
+            legacy: boolean;
+        };
+        classProperties: {
+            loose: boolean;
+        };
+    })[][];
+    plugins: string[];
+};

package/lib/configs/babel.config.js

@@ -0,0 +1,18 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function babelConfig(api) {
+    api.cache(true);
+    return {
+        presets: [
+            [
+                require.resolve('babel-preset-remax'),
+                { typescript: true, decorators: { legacy: true }, classProperties: { loose: true } },
+            ],
+        ],
+        plugins: [
+            require.resolve('babel-plugin-minify-dead-code-elimination'),
+            require.resolve('babel-plugin-transform-prune-unused-imports'),
+        ],
+    };
+}
+exports.default = babelConfig;

package/lib/index.d.ts

@@ -0,0 +1,2 @@
+import build from './build';
+export { build };

package/lib/index.js

@@ -0,0 +1,8 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.build = void 0;
+const build_1 = __importDefault(require("./build"));
+exports.build = build_1.default;

package/lib/webpack-plugins/AppFrameworkEntry/index.d.ts

@@ -0,0 +1,13 @@
+import VirtualModules from 'webpack-virtual-modules';
+import { Compiler } from 'webpack';
+/**
+ * 小程序框架启动, 在文件顶部增加 .ray/main.mini 的适配
+ * 读取 TabBar 信息，注册页面到 router 上。实现 web 路由的跳转
+ */
+export default class AppFrameworkEntry {
+    virtualModules: VirtualModules;
+    source: string;
+    appFile: string;
+    constructor(appFile: string);
+    apply(compiler: Compiler): void;
+}

package/lib/webpack-plugins/AppFrameworkEntry/index.js

@@ -0,0 +1,49 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+const webpack_virtual_modules_1 = __importDefault(require("webpack-virtual-modules"));
+const fs_extra_1 = __importDefault(require("fs-extra"));
+const PLUGIN_NAME = `AppFrameworkEntry`;
+const AppFrameworkTemplate = function (source) {
+    return `import 'ray/main';
+${source}`;
+};
+/**
+ * 小程序框架启动, 在文件顶部增加 .ray/main.mini 的适配
+ * 读取 TabBar 信息，注册页面到 router 上。实现 web 路由的跳转
+ */
+class AppFrameworkEntry {
+    constructor(appFile) {
+        this.virtualModules = new webpack_virtual_modules_1.default();
+        this.source = ``;
+        this.appFile = appFile;
+    }
+    apply(compiler) {
+        const { context } = compiler.options;
+        compiler.hooks.make.tapAsync(PLUGIN_NAME, (compilation, callback) => __awaiter(this, void 0, void 0, function* () {
+            this.virtualModules.apply(compiler);
+            const appSource = yield fs_extra_1.default.readFile(this.appFile).then((b) => b.toString());
+            const newSource = appSource;
+            if (newSource !== this.source) {
+                this.source = newSource;
+                this.virtualModules.writeModule(this.appFile, AppFrameworkTemplate(this.source));
+            }
+            callback();
+        }));
+        compiler.hooks.afterCompile.tap(PLUGIN_NAME, (compilation) => {
+            compilation.fileDependencies.add(this.appFile);
+        });
+    }
+}
+exports.default = AppFrameworkEntry;

package/package.json

@@ -0,0 +1,69 @@
+{
+  "name": "@ray-js/builder-mp",
+  "version": "0.3.0-beta.1c347991",
+  "description": "Ray builder for mini program",
+  "keywords": [
+    "ray"
+  ],
+  "author": "子长 <zichang.nong@tuya.com>",
+  "license": "MIT",
+  "main": "lib/index.js",
+  "files": [
+    "lib"
+  ],
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org"
+  },
+  "scripts": {
+    "clean": "rm -rf lib",
+    "build": "tsc -p ./tsconfig.build.json",
+    "watch": "tsc -p ./tsconfig.build.json --watch",
+    "test": "jest"
+  },
+  "dependencies": {
+    "@babel/template": "^7.16.0",
+    "@babel/traverse": "^7.16.3",
+    "@babel/types": "^7.16.0",
+    "@ray-js/remax-tuya": "^0.3.0-beta.1c347991",
+    "@ray-js/shared": "^0.3.0-beta.1c347991",
+    "@ray-js/types": "^0.3.0-beta.1c347991",
+    "@remax/build-store": "2.15.6",
+    "@remax/cli": "2.15.6",
+    "@remax/plugin-less": "^1.0.0",
+    "@remax/types": "2.15.6",
+    "babel-loader": "^8.2.3",
+    "babel-plugin-minify-dead-code-elimination": "^0.5.1",
+    "babel-plugin-transform-prune-unused-imports": "^1.0.1",
+    "babel-preset-remax": "2.15.6",
+    "change-case": "^4.1.2",
+    "colors": "1.4.0",
+    "fs-extra": "^10.0.0",
+    "less": "3.x",
+    "postcss-units-transform": "^1.1.0",
+    "pretty-bytes": "^5.6.0",
+    "react": "^17.0.2",
+    "remax": "2.15.6",
+    "rimraf": "^3.0.2",
+    "slash": "^3.0.0",
+    "webpack": "^4",
+    "webpack-chain": "^6.5.1",
+    "webpack-virtual-modules": "^0.4.3"
+  },
+  "devDependencies": {
+    "@types/jest": "^27.0.2",
+    "@types/node": "^16.9.1",
+    "babel-plugin-tester": "^10.1.0",
+    "jest": "^27.2.2",
+    "ts-jest": "^27.0.5",
+    "typescript": "^4.4.3"
+  },
+  "maintainers": [
+    {
+      "name": "tuyafe",
+      "email": "tuyafe@tuya.com"
+    }
+  ],
+  "gitHead": "e0bd013022ddda63380d3c9e20fd8cadb46cd61f",
+  "repository": {}
+}