{"componentChunkName":"component---src-templates-post-template-js","path":"/zh-CN/start/introduction","result":{"data":{"current":{"frontmatter":{"title":"Introduction 介绍","order":1,"brief":"Semi Design 是一个设计系统，它定义了一套中后台设计与前端基础组件，帮助我们更容易地创造更加一致的用户体验。","icon":"doc-intro"},"fields":{"type":"start"},"tableOfContents":{"items":[{"url":"#什么是-semi","title":"什么是 Semi"},{"url":"#我们的愿景","title":"我们的愿景","items":[{"url":"#设计--不变与多变","title":"设计 —— 不变与多变"},{"url":"#主题化--品牌一键定制","title":"主题化 —— 品牌一键定制"},{"url":"#深色模式","title":"深色模式"},{"url":"#国际化--多元兼容","title":"国际化 —— 多元兼容"},{"url":"#跨框架技术方案","title":"跨框架技术方案","items":[{"url":"#foundation","title":"Foundation"},{"url":"#adapter","title":"Adapter"}]}]},{"url":"#展望","title":"展望","items":[{"url":"#design-to-code","title":"Design to Code"},{"url":"#a11y","title":"A11y"},{"url":"#多框架","title":"多框架"}]},{"url":"#设计资源-","title":"设计资源  "},{"url":"#兼容性","title":"兼容性"}]},"body":"var _excluded = [\"components\"];\nfunction _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }\nfunction _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }\nfunction _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }\n/* @jsxRuntime classic */\n/* @jsx mdx */\n\nvar _frontmatter = {\n  \"category\": \"开始\",\n  \"title\": \"Introduction 介绍\",\n  \"icon\": \"doc-intro\",\n  \"localeCode\": \"zh-CN\",\n  \"order\": 1,\n  \"brief\": \"Semi Design 是一个设计系统，它定义了一套中后台设计与前端基础组件，帮助我们更容易地创造更加一致的用户体验。\"\n};\nvar layoutProps = {\n  _frontmatter: _frontmatter\n};\nvar MDXLayout = \"wrapper\";\nreturn function MDXContent(_ref) {\n  var components = _ref.components,\n    props = _objectWithoutProperties(_ref, _excluded);\n  return mdx(MDXLayout, _extends({}, layoutProps, props, {\n    components: components,\n    mdxType: \"MDXLayout\"\n  }), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u4EC0\\u4E48\\u662F Semi\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Semi Design \\u662F\\u7531\\u6296\\u97F3\\u524D\\u7AEF\\u56E2\\u961F\\uFF0CMED \\u4EA7\\u54C1\\u8BBE\\u8BA1\\u56E2\\u961F\\u8BBE\\u8BA1\\u3001\\u5F00\\u53D1\\u5E76\\u7EF4\\u62A4\\u7684\\u8BBE\\u8BA1\\u7CFB\\u7EDF\\u3002\\u5B83\\u4F5C\\u4E3A\\u5168\\u9762\\u3001\\u6613\\u7528\\u3001\\u4F18\\u8D28\\u7684\\u73B0\\u4EE3\\u5E94\\u7528 UI \\u89E3\\u51B3\\u65B9\\u6848\\uFF0C\\u4ECE\\u5B57\\u8282\\u8DF3\\u52A8\\u5404\\u4E1A\\u52A1\\u7EBF\\u7684\\u590D\\u6742\\u573A\\u666F\\u63D0\\u70BC\\u800C\\u6765\\uFF0C\\u652F\\u6491\\u8FD1\\u5343\\u8BA1\\u5E73\\u53F0\\u4EA7\\u54C1\\uFF0C\\u670D\\u52A1\\u5185\\u5916\\u90E8 10 \\u4E07+ \\u7528\\u6237\\u3002\")), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u6211\\u4EEC\\u7684\\u613F\\u666F\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Semi \\u591A\\u7528\\u4E8E\\u524D\\u7F00\\u6216\\u8BCD\\u7EC4\\u4E2D\\uFF0C\\u8868\\u793A\\u300C\\u4E00\\u534A\\u300D \\u2014\\u2014 \\u6B63\\u5982\\u540C\\u4E00\\u4E2A\\u5B8C\\u6574\\u7684\\u4F01\\u4E1A\\u5E94\\u7528\\uFF0C\\u901A\\u5E38\\u7531\\u4E1A\\u52A1\\u903B\\u8F91\\u4E0E\\u524D\\u7AEF\\u754C\\u9762\\u6784\\u6210\\uFF0CSemi Design \\u5E0C\\u671B\\u6210\\u4E3A\\u8FD9\\u4E0D\\u53EF\\u6216\\u7F3A\\u7684\\u4E00\\u534A\\uFF0C\\u4E3A\\u4F01\\u4E1A\\u5E94\\u7528\\u524D\\u7AEF\\u63D0\\u4F9B\\u575A\\u5B9E\\u4E14\\u4F18\\u8D28\\u7684\\u57FA\\u7840\\u3002\", mdx(\"br\", {\n    parentName: \"p\"\n  }), \"\\n\", \"\\u6211\\u4EEC\\u76F8\\u4FE1\\uFF0C\\u8BBE\\u8BA1\\u7CFB\\u7EDF\\u7684\\u771F\\u6B63\\u4EF7\\u503C\\u5728\\u4E8E\\u964D\\u4F4E\\u524D\\u7AEF\\u7684\\u642D\\u5EFA\\u6210\\u672C\\uFF0C\\u540C\\u65F6\\u63D0\\u4F9B\\u4F18\\u79C0\\u7684\\u8BBE\\u8BA1\\u548C\\u5DE5\\u7A0B\\u5316\\u6807\\u51C6\\uFF0C\\u5145\\u5206\\u89E3\\u653E\\u8BBE\\u8BA1\\u5E08\\u4E0E\\u5F00\\u53D1\\u8005\\u7684\\u751F\\u4EA7\\u529B\\uFF0C\\u4ECE\\u800C\\u4E0D\\u65AD\\u5B75\\u5316\\u660E\\u661F\\u4EA7\\u54C1\\u3002\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u8BBE\\u8BA1 \\u2014\\u2014 \\u4E0D\\u53D8\\u4E0E\\u591A\\u53D8\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u8FD1\\u5E74\\u6765\\uFF0C\\u8D8A\\u6765\\u8D8A\\u591A\\u7684 SaaS \\u4EA7\\u54C1\\u5982 Slack\\uFF0CNotion\\uFF0CFigma\\uFF0C\\u5F00\\u59CB\\u4F9D\\u9760\\u4F18\\u79C0\\u7684\\u7528\\u6237\\u4F53\\u9A8C\\u6765\\u63A8\\u52A8\\u589E\\u957F\\u3002\\u5BF9\\u4EA7\\u54C1\\u7684\\u8BC4\\u5224\\u6807\\u51C6\\uFF0C\\u5DF2\\u4ECE\\u91C7\\u8D2D\\u65B9\\u9010\\u6E10\\u8F6C\\u79FB\\u5230\\u7EC8\\u7AEF\\u7528\\u6237\\uFF1B\\u4E00\\u4E2A\\u4EA7\\u54C1\\u4F53\\u9A8C\\u7684\\u597D\\u4E0E\\u574F\\uFF0C\\u5C06\\u76F4\\u63A5\\u5F71\\u54CD\\u7528\\u6237\\u662F\\u5426\\u7EE7\\u7EED\\u4F7F\\u7528\\uFF0CB \\u7AEF\\u4EA7\\u54C1\\u7684\\u4F53\\u9A8C\\u8BBE\\u8BA1\\u4E5F\\u53D8\\u5F97\\u6108\\u53D1\\u91CD\\u8981\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Semi Design \\u59CB\\u7EC8\\u81F4\\u529B\\u4E8E\\u63D0\\u5347\\u4F01\\u4E1A\\u5E94\\u7528\\u7684\\u4F53\\u9A8C\\u3002\\u901A\\u8FC7\\u63D0\\u70BC\\u7B80\\u6D01\\u8F7B\\u91CF\\uFF0C\\u73B0\\u4EE3\\u5316\\u7684\\u8BBE\\u8BA1\\u98CE\\u683C\\uFF0C\\u7EC6\\u81F4\\u6253\\u78E8\\u539F\\u5B50\\u7EC4\\u4EF6\\u7684\\u4EA4\\u4E92\\uFF0C\\u5E76\\u5728\\u5B57\\u8282\\u8DF3\\u52A8\\u7684\\u6D77\\u91CF\\u4E1A\\u52A1\\u573A\\u666F\\u4E0B\\u8FDB\\u884C\\u8FED\\u4EE3\\uFF0C\\u6C89\\u6DC0\\u4E86\\u4E00\\u5957\\u4F18\\u8D28\\u7684\\u9ED8\\u8BA4\\u57FA\\u7840 \\u2014\\u2014 \\u5B83\\u5C06\\u4FDD\\u8BC1 Semi \\u6253\\u9020\\u7684\\u4F01\\u4E1A\\u5E94\\u7528\\u4EA7\\u54C1\\uFF0C\\u5929\\u751F\\u62E5\\u6709\\u8FDE\\u8D2F\\u4E00\\u81F4\\u7684\\u300C\\u8BED\\u8A00\\u300D\\uFF0C\\u548C\\u660E\\u663E\\u4F18\\u4E8E\\u9648\\u65E7\\u7CFB\\u7EDF\\u7684\\u8D28\\u91CF\\u57FA\\u7EBF\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u6B64\\u5916\\uFF0C\\u4E00\\u4E2A\\u597D\\u7684\\u8BBE\\u8BA1\\u7CFB\\u7EDF\\u5FC5\\u987B\\u662F\\u300C\\u6D3B\\u7684\\u300D\\uFF0C\\u5B83\\u9700\\u8981\\u80FD\\u8DDF\\u968F\\u4E1A\\u52A1\\u7684\\u589E\\u957F\\u800C\\u53D1\\u5C55\\u3001\\u66F4\\u65B0\\u3002\\u56E0\\u6B64\\uFF0CSemi \\u4ECE\\u672A\\u5C1D\\u8BD5\\u7EA6\\u675F\\u7528\\u6237\\uFF0C\\u56FA\\u5316\\u6240\\u8C13\\u7684\\u300C\\u7EDF\\u4E00\\u89C4\\u8303\\u300D\\uFF0C\\u800C\\u662F\\u5728\\u9ED8\\u8BA4\\u57FA\\u7840\\u4E0A\\uFF0C\\u5145\\u5206\\u8FDB\\u884C\\u6A21\\u5757\\u5316\\u89E3\\u8026\\uFF0C\\u5E76\\u5F00\\u653E\\u81EA\\u5B9A\\u4E49\\u80FD\\u529B\\uFF0C\\u65B9\\u4FBF\\u7528\\u6237\\u8FDB\\u884C\\u4E8C\\u6B21\\u88C1\\u526A\\u4E0E\\u5B9A\\u5236\\uFF0C\\u642D\\u5EFA\\u9002\\u7528\\u4E8E\\u4E0D\\u540C\\u5F62\\u6001\\u4EA7\\u54C1\\u7684\\u524D\\u7AEF\\u8D44\\u4EA7\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://lf9-static.semi.design/obj/semi-tos/images/introduction-showcase.gif\",\n    \"alt\": \"基于 Semi Design 的多元化产品与团队组件\"\n  })), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u575A\\u5B88\\u4F18\\u8D28\\u4E14\\u7A33\\u5B9A\\u7684\\u9ED8\\u8BA4\\u57FA\\u7840(\\u4E0D\\u53D8)\\uFF0C\\u5E76\\u5728\\u9700\\u8981\\u65F6\\u5145\\u5206\\u5F00\\u653E\\u81EA\\u5B9A\\u4E49\\u7684\\u7075\\u6D3B\\u5EA6(\\u591A\\u53D8)\\uFF0C\\u8FD9\\u662F Semi Design \\u72EC\\u7279\\u7684\\uFF0C\\u5E76\\u5C06\\u4E00\\u76F4\\u9075\\u5FAA\\u7684\\u8BBE\\u8BA1\\u539F\\u5219\\u3002\")), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u4E3B\\u9898\\u5316 \\u2014\\u2014 \\u54C1\\u724C\\u4E00\\u952E\\u5B9A\\u5236\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Semi \\u662F\\u5982\\u4F55\\u5728\\u8FDE\\u8D2F\\u7EDF\\u4E00\\u7684\\u57FA\\u7840\\u4E0A\\uFF0C\\u505A\\u5230\\u7075\\u6D3B\\u591A\\u53D8\\u7684\\uFF1F\\u7B54\\u6848\\u662F\\u5F3A\\u5927\\u7684\\u4E3B\\u9898\\u5316\\u65B9\\u6848\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u901A\\u8FC7\\u5BF9\\u6570\\u5343\\u4E2A\\u8BBE\\u8BA1\\u53D8\\u91CF (Design Token) \\u7684\\u5206\\u5C42\\u548C\\u68B3\\u7406\\uFF0C\\u8BBE\\u8BA1\\u5E08\\u548C\\u5F00\\u53D1\\u8005\\u53EF\\u5728\\u5168\\u5C40\\u3001\\u4E43\\u81F3\\u7EC4\\u4EF6\\u7EA7\\u522B\\uFF0C\\u5BF9 \\u8868\\u73B0\\u5C42\\u8FDB\\u884C\\u6DF1\\u5EA6\\u5B9A\\u5236 \\u2014\\u2014 \\u5373\\u4F7F\\u4F60\\u4E0D\\u4E86\\u89E3 CSS\\uFF0C\\u4E5F\\u53EF\\u4EE5\", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u901A\\u8FC7\\u4E3B\\u9898\\u7F16\\u8F91\\u5668(DSM)\\uFF0C\\u6253\\u9020\\u7B26\\u5408\\u4E1A\\u52A1\\u548C\\u54C1\\u724C\\u591A\\u6837\\u5316\\u89C6\\u89C9\\u9700\\u6C42\\u7684\\u98CE\\u683C\"), \"\\u3002\\u5F00\\u53D1\\u8005\\u5219\\u53EF\\u901A\\u8FC7 npm \\u5305\\u4E00\\u952E\\u53D1\\u5E03\\u5E76\\u66FF\\u6362\\uFF0C\\u8F7B\\u677E\\u5B9A\\u5236\\uFF0C\\u6613\\u4E8E\\u7BA1\\u7406\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4F60\\u53EF\\u4EE5\\u5728\", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://semi.design/dsm_store\"\n  }, \"Semi DSM\"), \"\\uFF0C\\u67E5\\u770B Semi \\u5728\\u6296\\u97F3\\u3001\\u526A\\u6620\\u3001\\u98DE\\u4E66\\u3001\\u706B\\u5C71\\u5F15\\u64CE\\u7B49\\u4E0D\\u540C\\u54C1\\u724C\\u573A\\u666F\\u4E0B\\u7684\\u5B98\\u65B9\\u793A\\u4F8B\\u4E3B\\u9898\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/tech-doc/p3.gif\",\n    \"alt\": \"全面覆盖的设计变量用例、文档与编辑器\"\n  })), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"DSM\\u8FD8\\u652F\\u6301 \", mdx(\"strong\", {\n    parentName: \"p\"\n  }, \"\\u4ECE\\u7EBF\\u4E0A\\u5230\\u8BBE\\u8BA1\\u5DE5\\u5177\\u7684\\u5B9E\\u65F6\\u540C\\u6B65\"), \" \\u2014\\u2014 Design Token\\u53EF\\u4EE5\\u540C\\u65F6\\u5728\\u5DE5\\u7A0B\\u9879\\u76EE\\u4E0EFigma\\u4E2D\\u8FDB\\u884C\\u6D88\\u8D39\\uFF0C\\u5728\\u63D0\\u5347\\u6548\\u7387\\u7684\\u540C\\u65F6\\uFF0C\\u8FDB\\u4E00\\u6B65\\u4FDD\\u8BC1\\u8BBE\\u8BA1\\u548C\\u7814\\u53D1\\u7684\\u6301\\u7EED\\u5BF9\\u9F50\\uFF0C\\u964D\\u4F4E\\u4EA7\\u7814\\u95F4\\u7684\\u6C9F\\u901A\\u6210\\u672C\\u3002\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u6DF1\\u8272\\u6A21\\u5F0F\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4E3A\\u4E86\\u517C\\u5BB9\\u66F4\\u591A\\u7528\\u6237\\u7FA4\\u4F53\\u5728\\u4E0D\\u540C\\u751F\\u4EA7\\u73AF\\u5883\\u4E0B\\u7684\\u4F7F\\u7528\\u504F\\u597D\\uFF0C\\u4F5C\\u4E3A\\u6D45\\u8272\\u6A21\\u5F0F\\u7684\\u8865\\u5145\\uFF0CSemi Design \\u7684\\u4EFB\\u610F\\u4E3B\\u9898\\u5747\\u81EA\\u52A8\\u652F\\u6301\\u6DF1\\u8272\\u6A21\\u5F0F\\uFF0C\\u5E76\\u80FD\\u5728\\u5E94\\u7528\\u8FD0\\u884C\\u65F6\\u52A8\\u6001\\u5207\\u6362\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4E0D\\u4EC5\\u5982\\u6B64\\uFF0CSemi \\u5E76\\u4E14\\u5141\\u8BB8\\u7528\\u6237\\u5728\\u5E94\\u7528\\u5185\\u5C40\\u90E8\\u533A\\u57DF\\u5F00\\u542F\\u6DF1\\u8272\\u6A21\\u5F0F\\uFF0C\\u4EE5\\u517C\\u5BB9 SDK \\u6216\\u63D2\\u4EF6\\u578B\\u4EA7\\u54C1\\u7684\\u4F7F\\u7528\\u573A\\u666F\\u3002\\u901A\\u8FC7\\u8FDB\\u9636\\u8BBE\\u7F6E\\uFF0C\\u7528\\u6237\\u4E5F\\u53EF\\u4EE5\\u5B9E\\u73B0\\u5E94\\u7528\\u548C\\u7CFB\\u7EDF\\u4E3B\\u9898\\u81EA\\u52A8\\u4FDD\\u6301\\u4E00\\u81F4\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u540C\\u65F6\\uFF0C\\u4E3A\\u4E86\\u8FDB\\u4E00\\u6B65\\u63D0\\u5347\\u5F00\\u53D1\\u4F53\\u9A8C\\uFF0C\\u6211\\u4EEC\\u4E5F\\u63D0\\u4F9B\\u4E86\\u5C06\\u672A\\u89C4\\u8303\\u5316\\u7684\\u5B58\\u91CF\\u65E7\\u5DE5\\u7A0B\\u4E00\\u952E\\u517C\\u5BB9\\u5230 Semi \\u6697\\u8272\\u6A21\\u5F0F\\u7684 cli \\u5DE5\\u5177\\uFF0C\\u901A\\u8FC7\\u81EA\\u52A8\\u5316\\u7684\\u65B9\\u5F0F\\u89C4\\u907F\\u8FC1\\u79FB\\u6210\\u672C\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://lf26-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/tech-doc/p4darkmode.gif\",\n    \"alt\": \"Semi 深色模式在业务系统中的应用\"\n  })), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u56FD\\u9645\\u5316 \\u2014\\u2014 \\u591A\\u5143\\u517C\\u5BB9\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5728\\u5B57\\u8282\\u8DF3\\u52A8\\u5168\\u7403\\u5316\\u4E1A\\u52A1\\u5B9E\\u8DF5\\u4E0B\\uFF0CSemi Design \\u7ECF\\u8FC7 30+ \\u7248\\u672C\\u8FED\\u4EE3\\uFF0C\\u5DF2\\u5177\\u5907\\u5B8C\\u5584\\u7684\\u56FD\\u9645\\u5316\\u7279\\u6027 \\u2014\\u2014 \\u8986\\u76D6\\u7B80/\\u7E41\\u4F53\\u4E2D\\u6587\\uFF0C\\u82F1\\u8BED\\u3001\\u65E5\\u8BED\\u3001\\u97E9\\u8BED\\u3001\\u8461\\u8404\\u7259\\u8BED\\u7B49 20+ \\u8BED\\u8A00\\uFF0C\\u65E5\\u671F\\u65F6\\u95F4\\u7EC4\\u4EF6\\u63D0\\u4F9B\\u5168\\u7403\\u65F6\\u533A\\u652F\\u6301\\uFF0C\\u5168\\u90E8\\u7EC4\\u4EF6\\u53EF\\u81EA\\u52A8\\u9002\\u914D\\u963F\\u62C9\\u4F2F\\u6587 RTL \\u5E03\\u5C40\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u540C\\u65F6\\uFF0C\\u968F\\u4E1A\\u52A1\\u7684\\u62D3\\u5C55\\uFF0C\\u4E5F\\u4E0D\\u65AD\\u6709\\u6D77\\u5916\\u5730\\u533A\\u7684\\u5F00\\u53D1\\u8005\\u5F00\\u59CB\\u4F7F\\u7528 Semi \\u6784\\u5EFA\\u5E94\\u7528\\u3002\\u4E3A\\u4E86\\u66F4\\u597D\\u5730\\u652F\\u6301\\u8FD9\\u90E8\\u5206\\u7528\\u6237\\u7684\\u8BC9\\u6C42\\uFF0C\\u6211\\u4EEC\\u4E5F\\u5BF9\\u7AD9\\u70B9\\u548C\\u6587\\u6863\\u8FDB\\u884C\\u4E86\\u53CC\\u8BED\\u9002\\u914D\\uFF0C\\u4EE5\\u4FDD\\u8BC1\\u5F00\\u53D1\\u65E0\\u969C\\u788D\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://lf9-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/tech-doc/p5global.png\",\n    \"alt\": \"海外运营平台产品 Powered by Semi Design\"\n  })), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u8DE8\\u6846\\u67B6\\u6280\\u672F\\u65B9\\u6848\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Semi Design \\u91C7\\u7528\\u4E86\\u4E00\\u5957\\u8DE8\\u524D\\u7AEF\\u6846\\u67B6\\u6280\\u672F\\u65B9\\u6848\\uFF0CF/A \\u5206\\u5C42\\u8BBE\\u8BA1\\uFF0C\\u5C06\\u6BCF\\u4E2A\\u7EC4\\u4EF6\\u7684 JavaScript \\u62C6\\u5206\\u4E3A\\u4E24\\u90E8\\u5206\\uFF1AFoundation \\u548C Adapter\\uFF0C\\u8FD9\\u4F7F\\u5F97\\u6211\\u4EEC\\u53EF\\u4EE5\\u901A\\u8FC7\\u4EC5\\u91CD\\u65B0\\u5B9E\\u73B0\\u9002\\u914D\\u5668\\u6765\\u8DE8\\u6846\\u67B6\\u91CD\\u7528 Foundation \\u4EE3\\u7801\\uFF0C\\u4F8B\\u5982 React\\u3001Vue\\u3001Angular\\u3001Svelte \\u6216\\u8005 WebComponent\\uFF0C\\u5FEB\\u901F\\u6253\\u9020\\u4E0D\\u540C\\u5E73\\u53F0\\u4E0A\\u7684\\u901A\\u7528\\u7EC4\\u4EF6\\u5E93\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://lf3-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/tech-doc/crossFrame.png\",\n    \"alt\": \"F/A架构\"\n  })), mdx(\"h4\", {\n    parentName: \"section\"\n  }, \"Foundation\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Foundation \\u5305\\u542B\\u6700\\u80FD\\u4EE3\\u8868 Semi Design \\u7EC4\\u4EF6\\u4EA4\\u4E92\\u7684\\u4E1A\\u52A1\\u903B\\u8F91\\uFF0C\\u5305\\u62EC UI \\u884C\\u4E3A\\u89E6\\u53D1\\u540E\\u7684\\u5404\\u79CD\\u8BA1\\u7B97\\u3001\\u5206\\u652F\\u5224\\u65AD\\u7B49\\u903B\\u8F91\\uFF0C\\u5B83\\u5E76\\u4E0D\\u76F4\\u63A5\\u64CD\\u4F5C\\u6216\\u8005\\u5F15\\u7528 DOM\\uFF0C\\u4EFB\\u610F\\u9700\\u8981 DOM \\u64CD\\u4F5C\\uFF0C\\u9A71\\u52A8\\u7EC4\\u4EF6\\u6E32\\u67D3\\u66F4\\u65B0\\u7684\\u90E8\\u5206\\u4F1A\\u59D4\\u6D3E\\u7ED9 Adapter \\u6267\\u884C\\u3002\"), mdx(\"h4\", {\n    parentName: \"section\"\n  }, \"Adapter\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Adapter \\u662F\\u4E00\\u4E2A\\u63A5\\u53E3\\uFF0C\\u5177\\u6709 Foundation \\u5B9E\\u73B0 Semi Design \\u4E1A\\u52A1\\u903B\\u8F91\\u6240\\u9700\\u7684\\u6240\\u6709\\u65B9\\u6CD5\\uFF0C\\u5E76\\u8D1F\\u8D23 1. \\u7EC4\\u4EF6 DOM \\u7ED3\\u6784\\u58F0\\u660E 2.\\u8D1F\\u8D23\\u6240\\u6709\\u8DDF DOM \\u64CD\\u4F5C/\\u66F4\\u65B0\\u76F8\\u5173\\u7684\\u903B\\u8F91\\uFF0C\\u901A\\u5E38\\u4F1A\\u4F7F\\u7528\\u6846\\u67B6 API \\u8FDB\\u884C setState\\u3001getState\\u3001addEventListener\\u3001removeListener \\u7B49\\u64CD\\u4F5C\\u3002\\u9002\\u914D\\u5668\\u53EF\\u4EE5\\u6709\\u8BB8\\u591A\\u5B9E\\u73B0\\uFF0C\\u5141\\u8BB8\\u4E0E\\u4E0D\\u540C\\u6846\\u67B6\\u7684\\u4E92\\u64CD\\u4F5C\\u6027\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u76EE\\u524D\\uFF0C\\u6211\\u4EEC\\u5B9E\\u73B0\\u4E86 Adapter \\u7684 React \\u7248\\u672C\\uFF0C\\u4F60\\u53EF\\u4EE5\\u76F4\\u63A5\\u901A\\u8FC7\\u5F15\\u5165 semi-ui \\u6765\\u4F7F\\u7528\\u6211\\u4EEC\\u7684 React \\u7EC4\\u4EF6\\u3002\\u5982\\u679C\\u4F60\\u5BF9 Semi \\u7684\\u67B6\\u6784\\u8BBE\\u8BA1\\u611F\\u5174\\u8DA3\\uFF0C\\u53EF\\u4EE5\\u8FDB\\u4E00\\u6B65\\u67E5\\u9605\", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://bytedance.feishu.cn/docs/doccnTgc0iGOVPubHZkwPpxXSNh#\"\n  }, \"\\u8FD9\\u7BC7\\u6587\\u7AE0\"), \"\\u3002\")), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u5C55\\u671B\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5728\\u672A\\u6765\\uFF0CSemi Design \\u56E2\\u961F\\u4F1A\\u6301\\u7EED\\u8FDB\\u884C\\u8D28\\u91CF\\u63D0\\u5347\\u4E0E\\u4F18\\u5316\\uFF0C\\u5E76\\u5C06\\u66F4\\u591A\\u5185\\u90E8\\u843D\\u5730\\u7684\\u5DE5\\u5177\\u94FE\\u4E0E\\u8D44\\u6E90\\uFF0C\\u9646\\u7EED\\u5F00\\u653E\\u7ED9\\u793E\\u533A\\u7528\\u6237\\uFF0C\\u5305\\u62EC\\u4E0D\\u9650\\u4E8E\\uFF1A\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"Design to Code\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u4E00\\u76F4\\u4EE5\\u6765\\uFF0CSemi \\u56E2\\u961F\\u90FD\\u5728\\u5C1D\\u8BD5\\u901A\\u8FC7\\u5404\\u7C7B\\u81EA\\u52A8\\u5316\\u624B\\u6BB5\\uFF0C\\u4F18\\u5316\\u65E5\\u5E38\\u5DE5\\u4F5C\\u6D41\\u7A0B\\uFF0C\\u5E2E\\u52A9\\u56E2\\u961F\\u8BBE\\u8BA1\\u5E08\\u548C\\u7814\\u53D1\\u63D0\\u6548\\uFF0C\\u751A\\u81F3\\u91CD\\u65B0\\u5B9A\\u4E49\\u4F20\\u7EDF\\u7684\\u5DE5\\u4F5C\\u65B9\\u5F0F\\u3002\\u5176\\u4E2D\\uFF0C\\u300C\\u524D\\u7AEF\\u9875\\u9762\\u8FD8\\u539F\\u300D\\u8FD9\\u4E00\\u73AF\\u8282\\u5B58\\u5728\\u8017\\u65F6\\u3001\\u6C9F\\u901A\\u6210\\u672C\\u9AD8\\u7B49\\u5404\\u79CD\\u4F4E\\u6548\\u95EE\\u9898\\uFF0C\\u4E00\\u76F4\\u662F\\u6211\\u4EEC\\u5173\\u6CE8\\u7684\\u91CD\\u70B9\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u76EE\\u524D\\uFF0C\\u6211\\u4EEC\\u5DF2\\u5B9E\\u73B0\\u4E86\\u8BBE\\u8BA1\\u7A3F\\u8F6C\\u4EE3\\u7801\\u529F\\u80FD\\u7684\\u5EFA\\u8BBE\\uFF0C\\u5E76\\u5728Landing Page\\u3001\\u8868\\u5355\\u9875\\u3001\\u8868\\u683C\\u9875\\u7B49\\u573A\\u666F\\u4E0B\\u8FDB\\u884C\\u4E86\\u6709\\u6548\\u9A8C\\u8BC1 \\u2014\\u2014 \\u4E8B\\u5B9E\\u4E0A\\uFF0C\", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://semi.design\"\n  }, \"https://semi.design\"), \" \\u5B98\\u7F51\\u6B63\\u662F\\u501F\\u52A9\\u8BE5\\u65B9\\u6848\\u8FDB\\u884C\\u5F00\\u53D1\\u4E0E\\u8FD8\\u539F\\u7684\\u3002  \"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5BF9\\u4E8E\\u8BBE\\u8BA1\\u4E2D\\u7684\\u7EC4\\u4EF6\\u7EA7\\u522B\\u7684\\u8BC6\\u522B\\u4E0E\\u8F6C\\u8BD1\\uFF0C\\u6211\\u4EEC\\u901A\\u8FC7 Code2Design + Design2Code \\u7684\\u65B9\\u5F0F\\u5B9E\\u73B0\\u4E86\\u652F\\u6301\\uFF0C\\u76EE\\u524D\\u6211\\u4EEC\\u5DF2\\u7ECF\\u5B9E\\u73B0\\u4E86 80%\\u7684\\u57FA\\u7840\\u7EC4\\u4EF6\\u8986\\u76D6\\uFF0C\\u4F60\\u53EF\\u4EE5\\u901A\\u8FC7 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://www.figma.com/community/plugin/1166339852662786534/Semi-Design-%E8%AE%BE%E8%AE%A1%E8%BD%AC%E4%BB%A3%E7%A0%81---%E7%A4%BE%E5%8C%BA%E7%89%88\"\n  }, \"Semi Figma Plugin\"), \" \\u8FDB\\u884C\\u4F53\\u9A8C\\uFF0C\\u8BE6\\u7EC6\\u4F7F\\u7528\\u6559\\u7A0B\\u53EF\\u67E5\\u9605 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://semi.design/code\"\n  }, \"https://semi.design/code\"), \" \"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u540E\\u7EED\\u7ED3\\u5408 D2C \\u5DE5\\u5177\\uFF0C\\u6211\\u4EEC\\u80FD\\u591F\\u5C06\\u56E2\\u961F\\u4ECE\\u6D77\\u91CF\\u4E1A\\u52A1\\u573A\\u666F\\u4E2D\\u6C89\\u6DC0\\u7684\\u9875\\u9762\\u8BBE\\u8BA1\\u6A21\\u677F\\uFF0C\\u4F4E\\u6210\\u672C\\u8F6C\\u6362\\u4E3A\\u4EE3\\u7801\\u6A21\\u677F\\uFF0C\\u7528\\u6237\\u5C06\\u80FD\\u4EE5\\u6781\\u4F4E\\u7684\\u6210\\u672C\\uFF0C\\u5FEB\\u901F\\u5B8C\\u6210\\u524D\\u7AEF\\u9875\\u9762\\u7684\\u514B\\u9686\\u548C\\u7ED3\\u6784\\u8FD8\\u539F\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://lf9-static.bytednsdoc.com/obj/eden-cn/ptlz_zlp/ljhwZthlaukjlkulzlp/tech-doc/semiPro.gif\",\n    \"alt\": \"Semi 页面模板 & 落地页转代码 (内部)\"\n  })), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"A11y\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Semi \\u91CD\\u89C6 Web \\u53EF\\u8BBF\\u95EE\\u6027\\uFF0C\\u5F53\\u524D\\u6211\\u4EEC\\u4ECE\\u8BED\\u4E49\\u5316\\u6807\\u7B7E\\uFF0C\\u4E3B\\u9898\\u8272\\u76D8\\u7B97\\u6CD5\\u53EF\\u5BF9\\u6BD4\\u5EA6\\u3001\\u6587\\u672C\\u611F\\u77E5\\u6027\\u7B49\\u65B9\\u9762\\u5B9E\\u73B0\\u4E86\\u7EC4\\u4EF6\\u7684\\u65E0\\u969C\\u788D\\u652F\\u6301\\u3002  \"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u5404\\u7EC4\\u4EF6\\u6587\\u6863\\u4E2D\\u7684 Accessibility \\u7AE0\\u8282\\u5BF9 WAI-ARIA \\u652F\\u6301\\u7A0B\\u5EA6\\u7ED9\\u51FA\\u4E86\\u8BE6\\u7EC6\\u7684\\u63CF\\u8FF0\\u4EE5\\u53CA\\u6700\\u4F73\\u5B9E\\u8DF5\\u5EFA\\u8BAE\\uFF0C\\u540C\\u65F6\\uFF0C\\u6211\\u4EEC\\u5BF9\\u4E8E\\u9AD8\\u9891\\u4F7F\\u7528\\u7684\\u7EC4\\u4EF6\\u4E5F\\u63D0\\u4F9B\\u4E86\\u952E\\u76D8\\u4E8B\\u4EF6\\u652F\\u6301\\u4EE5\\u53CA\\u7126\\u70B9\\u53EF\\u8BBF\\u95EE\\u6027\\u7684\\u65E0\\u969C\\u788D\\u652F\\u6301\\u3002\\u4F46\\u7531\\u4E8E\\u65E0\\u969C\\u788D\\u7684\\u6539\\u8FDB\\u662F\\u4E00\\u9879\\u5DE5\\u4F5C\\u91CF\\u8F83\\u5927\\u7684\\u5DE5\\u7A0B\\uFF0C\\u76EE\\u524D\\u6211\\u4EEC\\u5C1A\\u672A\\u5728\\u6240\\u6709\\u7EC4\\u4EF6\\u4E0A\\u63D0\\u4F9B\\u5B8C\\u5907\\u952E\\u76D8\\u4E0E\\u7126\\u70B9\\u65E0\\u969C\\u788D\\u529F\\u80FD\\uFF0C\\u66F4\\u591A\\u7684\\u8FDB\\u5C55\\u53EF\\u67E5\\u9605 \", mdx(\"a\", {\n    parentName: \"p\",\n    \"href\": \"https://github.com/DouyinFE/semi-design/issues/205\"\n  }, \"A11y Issue\"), \"  \"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Semi \\u56E2\\u961F\\u540E\\u7EED\\u4ECD\\u4F1A\\u6301\\u7EED\\u5173\\u6CE8\\u5E76\\u63D0\\u5347\\u7EC4\\u4EF6\\u7684\\u53EF\\u64CD\\u4F5C\\u6027\\u3001\\u53EF\\u611F\\u77E5\\u6027\\uFF0C\\u5728\\u6301\\u7EED\\u8FED\\u4EE3\\u4E2D\\uFF0C\\u5728\\u57FA\\u4E8E\\u9F20\\u6807\\u7684\\u64CD\\u4F5C\\u5916\\u63D0\\u4F9B\\u66F4\\u4FBF\\u6377\\u7684\\u952E\\u76D8\\u4EA4\\u4E92\\u4EE5\\u53CA\\u66F4\\u5B8C\\u5584\\u7684\\u65E0\\u969C\\u788D\\u529F\\u80FD\\u3002\"), mdx(\"h3\", {\n    parentName: \"section\"\n  }, \"\\u591A\\u6846\\u67B6\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u9AD8\\u5EA6\\u53EF\\u6269\\u5C55\\u6027\\u4F5C\\u4E3A Semi \\u7684\\u6838\\u5FC3\\u8BBE\\u8BA1\\u539F\\u5219\\uFF0C\\u8D2F\\u7A7F\\u4E8E Semi \\u7684\\u4EE3\\u7801\\u67B6\\u6784\\u8BBE\\u8BA1\\u3001API \\u8BBE\\u8BA1\\u3001\\u6837\\u5F0F\\u5C42\\u62BD\\u8C61\\u7B49\\u5404\\u4E2A\\u65B9\\u9762\\u3002\\u5F97\\u76CA\\u4E8E Foundation/Adapter \\u67B6\\u6784\\u8BBE\\u8BA1\\u4EE5\\u53CA\\u6837\\u5F0F\\u6587\\u4EF6\\u5206\\u5C42\\u539F\\u5219\\uFF0CSemi \\u975E\\u5E38\\u6613\\u4E8E\\u8FC1\\u79FB\\u5230\\u5176\\u4ED6\\u524D\\u7AEF\\u6846\\u67B6\\u3002\\u5728 2.0 \\u7248\\u672C\\uFF0C\\u6211\\u4EEC\\u57FA\\u4E8E Typescript \\u5BF9 Semi \\u8FDB\\u884C\\u4E86\\u91CD\\u5199\\uFF0C\\u671F\\u671B\\u5728\\u591A\\u6846\\u67B6\\u8FC1\\u79FB\\u9002\\u914D\\u8FC7\\u7A0B\\u4E2D\\u4F9D\\u7136\\u80FD\\u6709\\u826F\\u597D\\u7684\\u5F00\\u53D1\\u4F53\\u9A8C\\u4EE5\\u53CA\\u8D28\\u91CF\\u4FDD\\u969C\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"Foundation \\u5C42\\u540C\\u6837\\u57FA\\u4E8E MIT \\u534F\\u8BAE\\u5F00\\u6E90\\uFF0C\\u6211\\u4EEC\\u4F1A\\u5728\\u672A\\u6765\\u7684\\u8FED\\u4EE3\\u4E2D\\uFF0C\\u59CB\\u7EC8\\u4FDD\\u6301\\u5176\\u4EE3\\u7801\\u5B9E\\u73B0\\u7684\\u6846\\u67B6\\u65E0\\u5173\\u6027\\u3002\\u5982\\u679C\\u4F60\\u671F\\u671B\\u5C06 Semi Design \\u5E26\\u81F3\\u66F4\\u591A\\u5E73\\u53F0\\u6846\\u67B6\\uFF0C\\u6211\\u4EEC\\u975E\\u5E38\\u6B22\\u8FCE\\u4F60\\u5BF9\\u5176\\u8FDB\\u884C\\u76F4\\u63A5\\u590D\\u7528\\u3002\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, \"\\u6211\\u4EEC\\u56E2\\u961F\\u5F53\\u524D\\u9636\\u6BB5\\u91CD\\u70B9\\u4F1A\\u805A\\u7126\\u4E8E React \\u4F53\\u7CFB\\u5185\\uFF0C\\u4F46 WebComponent \\u4E5F\\u662F\\u6211\\u4EEC\\u91CD\\u70B9\\u5173\\u6CE8\\u7684\\u65B9\\u5411\\u4E4B\\u4E00\\u3002\\u672A\\u6765\\u65F6\\u673A\\u5408\\u9002\\uFF0C\\u6211\\u4EEC\\u4F1A\\u8FDB\\u884C\\u66F4\\u591A\\u7684\\u5C1D\\u8BD5\\uFF0C\\u656C\\u8BF7\\u671F\\u5F85\\u3002\")), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u8BBE\\u8BA1\\u8D44\\u6E90 \\xA0\"), mdx(\"p\", {\n    parentName: \"section\"\n  }, mdx(\"img\", {\n    parentName: \"p\",\n    \"src\": \"https://upload.wikimedia.org/wikipedia/commons/thumb/3/33/Figma-logo.svg/64px-Figma-logo.svg.png\",\n    \"alt\": \"Figma Logo\"\n  })), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u8BBE\\u8BA1\\u5E08\\u53EF\\u4EE5\\u4ECE Figma \\u7EC4\\u4EF6\\u5E93 \", mdx(\"a\", {\n    parentName: \"li\",\n    \"href\": \"https://www.figma.com/@semi\"\n  }, \"Semi Design System\"), \" \\u83B7\\u5F97\\u8272\\u76D8\\u3001\\u6837\\u5F0F\\u5E93\\u53CA\\u7EC4\\u4EF6\\u3002\"))), mdx(\"section\", null, mdx(\"h2\", {\n    parentName: \"section\"\n  }, \"\\u517C\\u5BB9\\u6027\"), mdx(\"ul\", {\n    parentName: \"section\"\n  }, mdx(\"li\", {\n    parentName: \"ul\"\n  }, \"\\u73B0\\u4EE3\\u6D4F\\u89C8\\u5668\\uFF08Semi \\u7684\\u6697\\u8272\\u6A21\\u5F0F/\\u6837\\u5F0F\\u6587\\u4EF6\\u4F9D\\u8D56\\u4E8E CSS variable\\uFF0C\\u6700\\u4F4E\\u7248\\u672C\\u8981\\u6C42\\u4E3A edge\\uFF0Cie11 \\u53CA\\u4EE5\\u4E0B\\u5747\\u4E0D\\u652F\\u6301\\uFF09\")), mdx(\"table\", {\n    parentName: \"section\"\n  }, mdx(\"thead\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"thead\"\n  }, mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"th\",\n    \"href\": \"http://godban.github.io/browsers-support-badges/\"\n  }, mdx(\"img\", {\n    src: \"https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png\",\n    alt: \"Edge\",\n    width: \"24px\",\n    height: \"24px\"\n  })), mdx(\"br\", null), \"Edge\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"th\",\n    \"href\": \"http://godban.github.io/browsers-support-badges/\"\n  }, mdx(\"img\", {\n    src: \"https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png\",\n    alt: \"Firefox\",\n    width: \"24px\",\n    height: \"24px\"\n  })), mdx(\"br\", null), \"Firefox\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"th\",\n    \"href\": \"http://godban.github.io/browsers-support-badges/\"\n  }, mdx(\"img\", {\n    src: \"https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png\",\n    alt: \"Chrome\",\n    width: \"24px\",\n    height: \"24px\"\n  })), mdx(\"br\", null), \"Chrome\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"th\",\n    \"href\": \"http://godban.github.io/browsers-support-badges/\"\n  }, mdx(\"img\", {\n    src: \"https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png\",\n    alt: \"Safari\",\n    width: \"24px\",\n    height: \"24px\"\n  })), mdx(\"br\", null), \" Safari\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"th\",\n    \"href\": \"http://godban.github.io/browsers-support-badges/\"\n  }, mdx(\"img\", {\n    src: \"https://raw.githubusercontent.com/alrra/browser-logos/master/src/opera/opera_48x48.png\",\n    alt: \"Opera\",\n    width: \"24px\",\n    height: \"24px\"\n  })), mdx(\"br\", null), \"Opera\"), mdx(\"th\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, mdx(\"a\", {\n    parentName: \"th\",\n    \"href\": \"http://godban.github.io/browsers-support-badges/\"\n  }, mdx(\"img\", {\n    src: \"https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png\",\n    alt: \"Electron\",\n    width: \"24px\",\n    height: \"24px\"\n  })), mdx(\"br\", null), \"Electron\"))), mdx(\"tbody\", {\n    parentName: \"table\"\n  }, mdx(\"tr\", {\n    parentName: \"tbody\"\n  }, mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"last 2 versions\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"last 2 versions\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"last 2 versions\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"last 2 versions\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"last 2 versions\"), mdx(\"td\", {\n    parentName: \"tr\",\n    \"align\": null\n  }, \"last 2 versions\"))))));\n}\n;\nMDXContent.isMDXComponent = true;"}},"pageContext":{"slug":"zh-CN/start/introduction","next":{"fields":{"slug":"en-US/start/getting-started"},"id":"6c216ee8-583a-58cc-9df2-97beabb4fe04","frontmatter":{"title":"Quick Start","localeCode":"en-US","icon":"doc-gettingstarted","showNew":null}},"previous":{"fields":{"slug":"en-US/start/introduction"},"id":"31e99450-077b-5623-ac3d-f51a471a3269","frontmatter":{"title":"Introduction","localeCode":"en-US","icon":"doc-intro","showNew":null}}}},"staticQueryHashes":["1348983216155057","1477422646155057","3245198693155057","417590761155057","63159454155057"]}