@tuya-sat/micro-dev-loader 0.0.1 → 0.0.5

package/dist/index.js

@@ -19,16 +19,16 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-var addjsLoader = function addjsLoader(sourceCode) {
-    var ref = (0, _loaderUtils).getOptions(this), _authedCode = ref.authedCode, authedCode = _authedCode === void 0 ? [] : _authedCode, microFramework = ref.microFramework;
-    var privileges = (0, _parseManifest).default().privileges;
-    var codeMaker = new _transform.default({
-        sourceCode: sourceCode,
-        microFramework: microFramework
+const addjsLoader = function(sourceCode) {
+    const { authedCode =[] , microFramework  } = (0, _loaderUtils).getOptions(this);
+    const { privileges  } = (0, _parseManifest).default();
+    const codeMaker = new _transform.default({
+        sourceCode,
+        microFramework
     });
     codeMaker.changeAst({
-        privileges: privileges,
-        authedCode: authedCode
+        privileges,
+        authedCode
     });
     return codeMaker.gtAst() + _manifestDom.default;
 };

package/dist/manifestDom.js

@@ -3,6 +3,13 @@ Object.defineProperty(exports, "__esModule", {
     value: true
 });
 exports.default = void 0;
-var manifestDom = "\n(function ExternalRender() {\n    const div = document.createElement('div');\n    const { insertDom } = require(\"@tuya-sat/micro-dev-component\");\n    insertDom(div)\n    document.body.appendChild(div);\n})();\n";
+const manifestDom = `
+(function ExternalRender() {
+    const div = document.createElement('div');
+    const { insertDom } = require("@tuya-sat/micro-dev-component");
+    insertDom(div)
+    document.body.appendChild(div);
+})();
+`;
 var _default = manifestDom;
 exports.default = _default;

package/dist/plugins/layoutMock/index.js

@@ -9,28 +9,6 @@ var _ejs = _interopRequireDefault(require("ejs"));
 var _cheerio = _interopRequireDefault(require("cheerio"));
 var _htmlWebpackPlugin = _interopRequireDefault(require("html-webpack-plugin"));
 var _parseManifest = _interopRequireDefault(require("../../utils/parseManifest"));
-function _arrayWithHoles(arr) {
-    if (Array.isArray(arr)) return arr;
-}
-function _classCallCheck(instance, Constructor) {
-    if (!(instance instanceof Constructor)) {
-        throw new TypeError("Cannot call a class as a function");
-    }
-}
-function _defineProperties(target, props) {
-    for(var i = 0; i < props.length; i++){
-        var descriptor = props[i];
-        descriptor.enumerable = descriptor.enumerable || false;
-        descriptor.configurable = true;
-        if ("value" in descriptor) descriptor.writable = true;
-        Object.defineProperty(target, descriptor.key, descriptor);
-    }
-}
-function _createClass(Constructor, protoProps, staticProps) {
-    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-    if (staticProps) _defineProperties(Constructor, staticProps);
-    return Constructor;
-}
 function _defineProperty(obj, key, value) {
     if (key in obj) {
         Object.defineProperty(obj, key, {
@@ -49,35 +27,9 @@ function _interopRequireDefault(obj) {
         default: obj
     };
 }
-function _iterableToArrayLimit(arr, i) {
-    var _arr = [];
-    var _n = true;
-    var _d = false;
-    var _e = undefined;
-    try {
-        for(var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true){
-            _arr.push(_s.value);
-            if (i && _arr.length === i) break;
-        }
-    } catch (err) {
-        _d = true;
-        _e = err;
-    } finally{
-        try {
-            if (!_n && _i["return"] != null) _i["return"]();
-        } finally{
-            if (_d) throw _e;
-        }
-    }
-    return _arr;
-}
-function _nonIterableRest() {
-    throw new TypeError("Invalid attempt to destructure non-iterable instance");
-}
 function _objectSpread(target) {
     for(var i = 1; i < arguments.length; i++){
-        var source = arguments[i] != null ? arguments[i] : {
-        };
+        var source = arguments[i] != null ? arguments[i] : {};
         var ownKeys = Object.keys(source);
         if (typeof Object.getOwnPropertySymbols === "function") {
             ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function(sym) {
@@ -90,61 +42,51 @@ function _objectSpread(target) {
     }
     return target;
 }
-function _slicedToArray(arr, i) {
-    return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _nonIterableRest();
-}
-var manifest = (0, _parseManifest).default();
-var lang = _fsExtra.default.readJSONSync(_path.default.resolve(process.cwd(), "_locales/zh-CN.json"));
-var layoutMockTpl = _fsExtra.default.readFileSync(_path.default.resolve(__dirname, "./layout-static/index.html"), {
+const manifest = (0, _parseManifest).default();
+const lang = _fsExtra.default.readJSONSync(_path.default.resolve(process.cwd(), "_locales/zh-CN.json"));
+const layoutMockTpl = _fsExtra.default.readFileSync(_path.default.resolve(__dirname, "./layout-static/index.html"), {
     encoding: "utf-8"
 });
-var LayoutMockPlugin = /*#__PURE__*/ function() {
-    "use strict";
-    function LayoutMockPlugin() {
-        _classCallCheck(this, LayoutMockPlugin);
+class LayoutMockPlugin {
+    static useLayoutStatic(app) {
+        app.get("/layout-static/*", function(req, res) {
+            res.sendFile(_path.default.join(__dirname, req.path));
+        });
     }
-    _createClass(LayoutMockPlugin, [
-        {
-            key: "apply",
-            value: function apply(compiler) {
-                compiler.hooks.compilation.tap("MyPlugin", function(compilation) {
-                    _htmlWebpackPlugin.default.getHooks(compilation).beforeEmit.tapAsync("LayoutMockPlugin", function(data, cb) {
-                        var $ = _cheerio.default.load(data.html);
-                        var name1 = manifest.name, defaultMenuIcon = manifest.defaultMenuIcon, entries = manifest.entries;
-                        data.html = _ejs.default.render(layoutMockTpl, {
-                            appName: function() {
-                                var ref = _slicedToArray(name1.split("."), 2), _ = ref[0], key = ref[1];
-                                return lang[key] || name1;
-                            }(),
-                            appIcon: defaultMenuIcon.url,
-                            menus: entries.map(function(item) {
-                                var name = item.name;
-                                var ref = _slicedToArray(name.split("."), 2), _ = ref[0], key = ref[1];
-                                return _objectSpread({
-                                }, item, {
-                                    langName: lang[key] || name
-                                });
-                            }),
-                            appHtml: [
-                                $("head").html(),
-                                $("body").html()
-                            ].join("")
-                        });
-                        cb(null, data);
-                    });
-                });
-            }
-        }
-    ], [
-        {
-            key: "useLayoutStatic",
-            value: function useLayoutStatic(app) {
-                app.get("/layout-static/*", function(req, res) {
-                    res.sendFile(_path.default.join(__dirname, req.path));
+    apply(compiler) {
+        compiler.hooks.compilation.tap("MyPlugin", (compilation)=>{
+            _htmlWebpackPlugin.default.getHooks(compilation).beforeEmit.tapAsync("LayoutMockPlugin", (data, cb)=>{
+                const $ = _cheerio.default.load(data.html);
+                const { name: name1 , defaultMenuIcon , entries  } = manifest;
+                const nameProcesser = (name)=>{
+                    const [_, key] = name.split(".");
+                    return lang[key] || name;
+                };
+                data.html = _ejs.default.render(layoutMockTpl, {
+                    appName: nameProcesser(name1),
+                    appIcon: defaultMenuIcon.url,
+                    menus: (()=>{
+                        const processer = (item)=>{
+                            return _objectSpread({}, item, {
+                                langName: nameProcesser(item.name)
+                            });
+                        };
+                        const entries$ = entries.length ? entries : [
+                            {
+                                name: name1,
+                                path: "/"
+                            }, 
+                        ];
+                        return entries$.map(processer);
+                    })(),
+                    appHtml: [
+                        $("head").html(),
+                        $("body").html()
+                    ].join("")
                 });
-            }
-        }
-    ]);
-    return LayoutMockPlugin;
-}();
+                cb(null, data);
+            });
+        });
+    }
+}
 exports.default = LayoutMockPlugin;

package/dist/plugins/layoutMock/layout-static/index.html

@@ -0,0 +1,181 @@
+<!DOCTYPE html>
+<html lang="en" style="margin: 0; padding: 0">
+  <head>
+    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
+    <meta charset="utf-8" />
+    <link rel="icon" href="favicon.ico" />
+    <meta name="viewport" content="width=device-width,initial-scale=1" />
+    <meta name="theme-color" content="#000000" />
+    <meta name="description" content="Tuya General Management Portal" />
+    <title><%= appName %></title>
+    <style>
+      .c-debugger-container {
+        width: 100vw;
+        height: 100vh;
+        display: flex;
+        flex-direction: column;
+      }
+      .c-debugger-header {
+        flex: 0 0 auto;
+        display: flex;
+        align-items: center;
+        justify-content: space-between;
+        height: 55px;
+        padding: 0 16px;
+        border-bottom: 1px solid #eee;
+        color: rgba(0, 0, 0, 0.85);
+      }
+      .c-debugger-logo {
+        position: relative;
+        overflow: hidden;
+        display: flex;
+        align-items: center;
+      }
+      .c-debugger-title {
+        color: #000;
+        font-size: 14px;
+        font-weight: 700;
+        height: 32px;
+        line-height: 32px;
+        margin: 0 0 0 12px;
+      }
+      .c-debugger-main {
+        display: flex;
+        flex: 1 1 auto;
+      }
+      .c-debugger-side {
+        flex: 0 0 auto;
+        width: 208px;
+        height: 100%;
+        border-right: 1px solid #f0f2f5;
+      }
+      .c-debugger-content {
+        flex: 1 1 auto;
+        height: 100%;
+        background-color: #f0f2f5;
+      }
+      #root {
+        width: 100%;
+        height: 100%;
+      }
+      .c-debugger-lang-trigger {
+        position: relative;
+        display: flex;
+        align-items: center;
+        white-space: nowrap;
+        cursor: pointer;
+        font-size: 14px;
+        font-weight: normal;
+        height: 100%;
+      }
+      .c-debugger-lang-trigger:hover .c-debugger-lang-list {
+        display: block;
+        line-height: 1.5;
+      }
+      .c-debugger-lang-trigger .c-debugger-lang-list {
+        position: absolute;
+        top: 42px;
+        right: -5px;
+        display: none;
+        background: #ffffff;
+        border-radius: 2px;
+        outline: none;
+        box-shadow: 0 3px 6px -4px rgb(0 0 0 / 12%),
+          0 6px 16px 0 rgb(0 0 0 / 8%), 0 9px 28px 8px rgb(0 0 0 / 5%);
+        z-index: 100;
+      }
+      .c-debugger-lang-trigger .c-debugger-lang-list span {
+        display: block;
+        padding: 5px 12px;
+      }
+      .c-debugger-lang-trigger .c-debugger-lang-list span:hover {
+        background-color: #f5f5f5;
+      }
+      .c-debugger-menu {
+        display: flex;
+        justify-content: flex-start;
+        align-items: center;
+        height: 40px;
+        padding: 0 0 0 17px;
+        margin: 4px 0 8px;
+        cursor: pointer;
+        font-size: 14px;
+        color: rgba(0, 0, 0, 0.85);
+      }
+      .c-debugger-menu-name {
+        margin-left: 10px;
+      }
+      .c-debugger-menu:hover {
+        color: #1890ff;
+      }
+    </style>
+  </head>
+  <body style="margin: 0; padding: 0">
+    <div class="c-debugger-container">
+      <div class="c-debugger-header">
+        <div class="c-debugger-logo">
+          <img
+            src="https://promotion-static.tuyacn.com/static/242969466160533504.png"
+            alt=""
+            style="height: 28px"
+          />
+          <div class="c-debugger-title"><%= appName %></div>
+        </div>
+
+        <div class="c-debugger-lang-trigger">
+          <span id="c-debugger-lang-name"></span>
+          <div class="c-debugger-lang-list">
+            <span onclick="changeLng('en-US')">English</span>
+            <span onclick="changeLng('zh-CN')">简体中文</span>
+          </div>
+        </div>
+      </div>
+      <div class="c-debugger-main">
+        <div class="c-debugger-side">
+          <% menus.forEach(function(menu){ %>
+          <div class="c-debugger-menu" onclick="toPage('<%= menu.path %>')">
+            <svg
+              viewBox="0 0 1024 1024"
+              version="1.1"
+              xmlns="http://www.w3.org/2000/svg"
+              p-id="2323"
+              width="14"
+              height="14"
+            >
+              <path
+                d="M192.037 287.953h640.124c17.673 0 32-14.327 32-32s-14.327-32-32-32H192.037c-17.673 0-32 14.327-32 32s14.327 32 32 32zM192.028 543.17h638.608c17.673 0 32-14.327 32-32s-14.327-32-32-32H192.028c-17.673 0-32 14.327-32 32s14.327 32 32 32zM832.161 735.802H192.037c-17.673 0-32 14.327-32 32s14.327 32 32 32h640.124c17.673 0 32-14.327 32-32s-14.327-32-32-32z"
+                fill=""
+                p-id="2324"
+              ></path>
+            </svg>
+            <div class="c-debugger-menu-name"><%= menu.langName %></div>
+          </div>
+          <% }); %>
+        </div>
+        <div class="c-debugger-content"><%- appHtml %></div>
+      </div>
+    </div>
+    <script>
+      (() => {
+        const lngMap = {
+          "en-US": "English",
+          "zh-CN": "简体中文",
+        };
+        const localLng = localStorage.getItem("i18nextLng");
+        const lng = lngMap[localLng] ? localLng : "zh-CN";
+        console.log(lng);
+        document.querySelector("#c-debugger-lang-name").textContent =
+          lngMap[lng];
+      })();
+
+      function toPage(path) {
+        window.location.href = new URL(path, window.location.origin);
+      }
+
+      function changeLng(lng, name) {
+        localStorage.setItem("i18nextLng", lng);
+        location.reload();
+      }
+    </script>
+  </body>
+</html>

package/dist/transform.js

@@ -7,111 +7,116 @@ var _core = require("@babel/core");
 var _template = _interopRequireDefault(require("@babel/template"));
 var _generator = _interopRequireDefault(require("@babel/generator"));
 var _pluginSyntaxTypescript = _interopRequireDefault(require("@babel/plugin-syntax-typescript"));
-function _classCallCheck(instance, Constructor) {
-    if (!(instance instanceof Constructor)) {
-        throw new TypeError("Cannot call a class as a function");
-    }
-}
-function _defineProperties(target, props) {
-    for(var i = 0; i < props.length; i++){
-        var descriptor = props[i];
-        descriptor.enumerable = descriptor.enumerable || false;
-        descriptor.configurable = true;
-        if ("value" in descriptor) descriptor.writable = true;
-        Object.defineProperty(target, descriptor.key, descriptor);
-    }
-}
-function _createClass(Constructor, protoProps, staticProps) {
-    if (protoProps) _defineProperties(Constructor.prototype, protoProps);
-    if (staticProps) _defineProperties(Constructor, staticProps);
-    return Constructor;
-}
 function _interopRequireDefault(obj) {
     return obj && obj.__esModule ? obj : {
         default: obj
     };
 }
-var VUE_TYPES = [
+const VUE_TYPES = [
     "VUE_TS",
     "VUE_JS"
 ];
-var REACT_TYPES = [
+const REACT_TYPES = [
     "REACT_TS",
     "REACT_JS"
 ];
-var CodeMaker = /*#__PURE__*/ function() {
-    "use strict";
-    function CodeMaker(param) {
-        var sourceCode = param.sourceCode, microFramework = param.microFramework;
-        _classCallCheck(this, CodeMaker);
-        this.ast = this.parse(sourceCode);
-        this.microFramework = microFramework;
+class CodeMaker {
+    parse(code) {
+        return (0, _core).parse(code, {
+            plugins: [
+                [
+                    _pluginSyntaxTypescript.default,
+                    {
+                        isTSX: true,
+                        allExtensions: true
+                    }, 
+                ], 
+            ]
+        });
     }
-    _createClass(CodeMaker, [
-        {
-            key: "parse",
-            value: function parse(code) {
-                return (0, _core).parse(code, {
-                    plugins: [
-                        [
-                            _pluginSyntaxTypescript.default,
-                            {
-                                isTSX: true,
-                                allExtensions: true
-                            }, 
-                        ], 
-                    ]
-                });
-            }
-        },
-        {
-            key: "changeAst",
-            value: function changeAst(props) {
-                var temp = this.getTemp(props);
-                (0, _core).traverse(this.ast, {
-                    ExportNamedDeclaration: function ExportNamedDeclaration(path) {
-                        var isTarget = false;
-                        try {
-                            isTarget = path.node.declaration.kind === "let" && path.node.declaration.declarations[0].id.name === "hasPermission";
-                        } catch (e) {
-                        }
-                        if (!isTarget) {
-                            return;
-                        }
-                        var tempNode = _template.default.ast(temp);
-                        path.insertAfter(tempNode);
-                    }
-                });
-            }
-        },
-        {
-            key: "gtAst",
-            value: function gtAst() {
-                var code = (0, _generator).default(this.ast).code;
-                return code;
-            }
-        },
-        {
-            key: "vueReRenderTemp",
-            value: function vueReRenderTemp() {
-                return "\n    const reRender = () => {\n      app.unmount()\n      render({})\n    }\n    ";
-            }
-        },
-        {
-            key: "reactReRenderTemp",
-            value: function reactReRenderTemp() {
-                return "\n    const reRender = () => {\n      ReactDOM.unmountComponentAtNode(document.querySelector('#root'))\n      render({})\n    }\n    ";
-            }
-        },
-        {
-            key: "getTemp",
-            value: function getTemp(props) {
-                var privileges = props.privileges, authedCode = props.authedCode;
-                var temp = "\n      {\n        window._allCodesStatusMap = new Map()\n        window._authedCodeInfoProxy = {}\n        hasPermission = (code) => {\n          return window._allCodesStatusMap.get(code)\n        };\n        const changeAuthedMap = (authedCode) => {\n          const privileges = ".concat(JSON.stringify(privileges), "\n          const allCodesStatus = privileges?.map(\n            ({ name, code }) => [\n              code,\n              authedCode.includes(code),\n            ]\n          );\n          window._allCodesStatusMap = new Map(allCodesStatus)\n        }\n        \n       ").concat(REACT_TYPES.includes(this.microFramework) ? this.reactReRenderTemp() : this.vueReRenderTemp(), "\n        const authedCodeInfo = {\n          authedCode:").concat(JSON.stringify(authedCode), "\n        }\n        \n        changeAuthedMap(authedCodeInfo.authedCode)\n        window._authedCodeInfoProxy = new Proxy(authedCodeInfo,{\n          get(target,prop){\n            return target[prop]\n          },\n          set(target,prop,value){\n            if(prop === 'authedCode') {\n              changeAuthedMap(value)\n              reRender()\n            }\n            target[prop] = value\n            return true\n          }\n        })\n\n      }\n    ");
-                return temp;
+    changeAst(props) {
+        const temp = this.getTemp(props);
+        (0, _core).traverse(this.ast, {
+            ExportNamedDeclaration (path) {
+                let isTarget = false;
+                try {
+                    isTarget = path.node.declaration.kind === "let" && path.node.declaration.declarations[0].id.name === "hasPermission";
+                } catch (e) {}
+                if (!isTarget) {
+                    return;
+                }
+                let tempNode = _template.default.ast(temp);
+                path.insertAfter(tempNode);
             }
+        });
+    }
+    gtAst() {
+        const { code  } = (0, _generator).default(this.ast);
+        return code;
+    }
+    vueReRenderTemp() {
+        return `
+    const reRender = () => {
+      app.unmount()
+      render({})
+    }
+    `;
+    }
+    reactReRenderTemp() {
+        return `
+    const reRender = () => {
+      ReactDOM.unmountComponentAtNode(document.querySelector('#root'))
+      render({})
+    }
+    `;
+    }
+    getTemp(props) {
+        const { privileges , authedCode  } = props;
+        const temp = `
+      {
+        window._allCodesStatusMap = new Map()
+        window._authedCodeInfoProxy = {}
+        hasPermission = (code) => {
+          return window._allCodesStatusMap.get(code)
+        };
+        const changeAuthedMap = (authedCode) => {
+          const privileges = ${JSON.stringify(privileges)}
+          const allCodesStatus = privileges?.map(
+            ({ name, code }) => [
+              code,
+              authedCode.includes(code),
+            ]
+          );
+          window._allCodesStatusMap = new Map(allCodesStatus)
+        }
+        
+       ${REACT_TYPES.includes(this.microFramework) ? this.reactReRenderTemp() : this.vueReRenderTemp()}
+        const authedCodeInfo = {
+          authedCode:${JSON.stringify(authedCode)}
         }
-    ]);
-    return CodeMaker;
-}();
+        
+        changeAuthedMap(authedCodeInfo.authedCode)
+        window._authedCodeInfoProxy = new Proxy(authedCodeInfo,{
+          get(target,prop){
+            return target[prop]
+          },
+          set(target,prop,value){
+            if(prop === 'authedCode') {
+              changeAuthedMap(value)
+              reRender()
+            }
+            target[prop] = value
+            return true
+          }
+        })
+
+      }
+    `;
+        return temp;
+    }
+    constructor({ sourceCode , microFramework  }){
+        this.ast = this.parse(sourceCode);
+        this.microFramework = microFramework;
+    }
+}
 exports.default = CodeMaker;

package/dist/utils/parseManifest.js

@@ -11,8 +11,8 @@ function _interopRequireDefault(obj) {
     };
 }
 function parseManifest() {
-    var MANIFEST_FILE = "manifest.json";
-    var cwd = process.cwd();
-    var manifest = _fsExtra.default.readJSONSync(_path.default.resolve(cwd, MANIFEST_FILE), "utf-8");
+    const MANIFEST_FILE = "manifest.json";
+    const cwd = process.cwd();
+    const manifest = _fsExtra.default.readJSONSync(_path.default.resolve(cwd, MANIFEST_FILE), "utf-8");
     return manifest;
 }

package/package.json

@@ -1,11 +1,11 @@
 {
   "name": "@tuya-sat/micro-dev-loader",
-  "version": "0.0.1",
+  "version": "0.0.5",
   "main": "dist/index.js",
   "license": "MIT",
   "scripts": {
     "dev": "swc src -D -w -d dist",
-    "build": "swc src -d dist",
+    "build": "swc src -D -d dist",
     "prepublish": "yarn build",
     "test": "jest --verbose ./__tests__"
   },