6 |
9 |
4 |
21 |
8 | {{ author.text }}
9 |
14 | ![]()
18 |
19 |
20 | 3 | {{ msg }} 4 |
5 | 6 | 7 | 16 | -------------------------------------------------------------------------------- /docs/.vuepress/components/OtherComponent.vue: -------------------------------------------------------------------------------- 1 | 2 |This is another component
3 | 4 | -------------------------------------------------------------------------------- /docs/.vuepress/components/demo-component.vue: -------------------------------------------------------------------------------- 1 | 2 |3 | {{ msg }} 4 |
5 | 6 | 7 | 16 | -------------------------------------------------------------------------------- /docs/.vuepress/config.js: -------------------------------------------------------------------------------- 1 | const { description } = require('../../package') 2 | 3 | module.exports = { 4 | /** 5 | * Ref：https://v1.vuepress.vuejs.org/config/#title 6 | */ 7 | title: 'RichLab', 8 | /** 9 | * Ref：https://v1.vuepress.vuejs.org/config/#description 10 | */ 11 | description: description, 12 | /** 13 | * Extra tags to be injected to the page HTML `` 14 | * 15 | * ref：https://v1.vuepress.vuejs.org/config/#head 16 | */ 17 | head: [ 18 | ['link', { 19 | rel: 'icon', 20 | href: 'https://gw.alipayobjects.com/zos/finxbff/compress-tinypng/7a6ec1c9-2680-4817-8748-eeab10cb1469.png' 21 | }], 22 | ['meta', { name: 'referrer', content: 'no-referrer' }], 23 | ['meta', { name: 'theme-color', content: '#272727' }], 24 | ['meta', { name: 'apple-mobile-web-app-capable', content: 'yes' }], 25 | ['meta', { name: 'apple-mobile-web-app-status-bar-style', content: 'black' }] 26 | ], 27 | 28 | postcss: { 29 | plugins: [ 30 | require('tailwindcss'), 31 | require('autoprefixer'), 32 | ] 33 | }, 34 | 35 | /** 36 | * Theme configuration, here is the default theme configuration for VuePress. 37 | * 38 | * ref：https://v1.vuepress.vuejs.org/theme/default-theme-config.html 39 | */ 40 | themeConfig: { 41 | repo: '', 42 | editLinks: false, 43 | docsDir: '', 44 | editLinkText: '', 45 | lastUpdated: false, 46 | logo: 'https://gw.alipayobjects.com/zos/finxbff/compress-tinypng/b1a25d04-6a13-4bb5-a929-a5f0db08b8de.png', 47 | nav: [ 48 | { 49 | text: 'Home', 50 | link: '/', 51 | }, 52 | { 53 | text: 'About', 54 | link: '/about/' 55 | }, 56 | { 57 | text: 'Blog', 58 | link: '/blog/' 59 | }, 60 | { 61 | text: 'Translations', 62 | link: '/translations/' 63 | }, 64 | { 65 | text: 'Team', 66 | link: '/team/' 67 | }, 68 | { 69 | text: 'Github', 70 | link: 'https://github.com/rich-lab' 71 | }, 72 | // { 73 | // text: 'Artworks', 74 | // link: 'https://github.com/rich-lab/art/' 75 | // } 76 | ], 77 | sidebar: { 78 | '/guide/': [ 79 | { 80 | title: 'Guide', 81 | collapsable: false, 82 | children: [ 83 | '', 84 | 'using-vue', 85 | ] 86 | } 87 | ], 88 | } 89 | }, 90 | 91 | /** 92 | * Apply plugins，ref：https://v1.vuepress.vuejs.org/zh/plugin/ 93 | */ 94 | plugins: [ 95 | 'cat', 96 | 'code-copy', 97 | ['sitemap', { 98 | hostname: 'https://richlab.design/', 99 | }], 100 | // ref: https://github.com/webmasterish/vuepress-plugin-feed 101 | ['feed', { 102 | canonical_base: 'https://richlab.design/', 103 | feeds: { 104 | rss2: { enable: true }, 105 | atom1: { enable: false }, 106 | json1: { enable: false }, 107 | }, 108 | posts_directories: [ 109 | '/blog/_posts', 110 | '/translations/_posts' 111 | ] 112 | }], 113 | ['@vuepress/google-analytics', { 114 | ga: 'UA-128189152-2' 115 | }], 116 | '@vuepress/plugin-back-to-top', 117 | '@vuepress/plugin-medium-zoom', 118 | [ 119 | '@vuepress/html-redirect', { 120 | countdown: 0 121 | } 122 | ], 123 | ['@vuepress-reco/comments', { 124 | solution: 'valine', 125 | options: { 126 | appId: 'yPsaft2cSPtwnXW6UiXBS4ld-gzGzoHsz', 127 | appKey: 'AYI4KeXQloUWsuebDElj8A67', 128 | } 129 | }], 130 | [ 131 | 'dynamic-base', 132 | { 133 | publicPath: process.env.NETLIFY_CI 134 | ? null 135 | : 'https://richlab.oss-cn-hangzhou.aliyuncs.com/', 136 | 137 | routeBash: { 138 | 'richlab.design': '/', 139 | 'rich-lab.github.io': '/blog/', 140 | } 141 | } 142 | ], 143 | [ 144 | '@vuepress/blog', 145 | { 146 | directories: [ 147 | { 148 | // Unique ID of current classification 149 | id: 'post', 150 | // Target directory 151 | dirname: 'blog/_posts', 152 | // Path of the `entry page` (or `list page`) 153 | path: '/blog/', 154 | itemPermalink: '/blog/:year/:month/:day/:slug', 155 | // layout: 'Layout', 156 | pagination: { 157 | lengthPerPage: 20, 158 | }, 159 | }, 160 | { 161 | // Unique ID of current classification 162 | id: 'translations', 163 | // Target directory 164 | dirname: 'translations/_posts', 165 | // Path of the `entry page` (or `list page`) 166 | path: '/translations/', 167 | itemPermalink: '/translations/:year/:month/:day/:slug', 168 | // layout: 'Layout', 169 | pagination: { 170 | lengthPerPage: 20, 171 | }, 172 | }, 173 | ], 174 | }, 175 | ], 176 | ] 177 | } 178 | -------------------------------------------------------------------------------- /docs/.vuepress/enhanceApp.js: -------------------------------------------------------------------------------- 1 | /** 2 | * Client app enhancement file. 3 | * 4 | * https://v1.vuepress.vuejs.org/guide/basic-config.html#app-level-enhancements 5 | */ 6 | import './theme/styles/font.css' 7 | 8 | export default ({ 9 | Vue, // the version of Vue being used in the VuePress app 10 | options, // the options for the root Vue instance 11 | router, // the router instance for the app 12 | siteData // site metadata 13 | }) => { 14 | // ...apply enhancements for the site. 15 | } 16 | -------------------------------------------------------------------------------- /docs/.vuepress/public/CNAME: -------------------------------------------------------------------------------- 1 | richlab.design 2 | -------------------------------------------------------------------------------- /docs/.vuepress/public/authors/jothy1023.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rich-lab/blog/5f96c3294cdec0107cb399ac6ca9351f07b0ec97/docs/.vuepress/public/authors/jothy1023.png -------------------------------------------------------------------------------- /docs/.vuepress/public/authors/pigcan.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rich-lab/blog/5f96c3294cdec0107cb399ac6ca9351f07b0ec97/docs/.vuepress/public/authors/pigcan.png -------------------------------------------------------------------------------- /docs/.vuepress/public/authors/ulivz.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rich-lab/blog/5f96c3294cdec0107cb399ac6ca9351f07b0ec97/docs/.vuepress/public/authors/ulivz.png -------------------------------------------------------------------------------- /docs/.vuepress/public/hy-back-text.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rich-lab/blog/5f96c3294cdec0107cb399ac6ca9351f07b0ec97/docs/.vuepress/public/hy-back-text.png -------------------------------------------------------------------------------- /docs/.vuepress/public/logo.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rich-lab/blog/5f96c3294cdec0107cb399ac6ca9351f07b0ec97/docs/.vuepress/public/logo.png -------------------------------------------------------------------------------- /docs/.vuepress/public/sddefault.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rich-lab/blog/5f96c3294cdec0107cb399ac6ca9351f07b0ec97/docs/.vuepress/public/sddefault.jpg -------------------------------------------------------------------------------- /docs/.vuepress/public/team.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/rich-lab/blog/5f96c3294cdec0107cb399ac6ca9351f07b0ec97/docs/.vuepress/public/team.png -------------------------------------------------------------------------------- /docs/.vuepress/redirects: -------------------------------------------------------------------------------- 1 | /2020/03/27/webpack-5-module-federation/ /translations/2020/03/27/webpack-5-module-federation/ 2 | -------------------------------------------------------------------------------- /docs/.vuepress/theme/components/Author.vue: -------------------------------------------------------------------------------- 1 | 2 |Oh, hello, nice to meet you!
13 |Professional & Creative & Freedom & Love.
15 |
3 |
3 |
3 |5 | 6 | 7 | 15 | -------------------------------------------------------------------------------- /docs/.vuepress/theme/index.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extend: '@vuepress/theme-default' 3 | } 4 | -------------------------------------------------------------------------------- /docs/.vuepress/theme/layouts/BlogBlockLayout.vue: -------------------------------------------------------------------------------- 1 | 2 |4 |
17 | 22 | 在 RichLab, 23 | 我们打造的前端项目每天都被数百万用户在使用。我们相信，是保持年轻、好玩、认真的心态，让团队富有创造力。这是每一位成员聚集在一起形成的团队基因。 24 |
25 |
35 | 
42 | 49 | 「得益于蚂蚁金服花呗借呗亿级用户的金融平台，我们有机会通过自研 2D/3D 50 | 引擎 (Oasis) 51 | 和工作流，开发出动画、游戏等富交互应用，帮助业务获得更高的增长。」 52 |
53 |54 | —— RichLab 自研 2D/3D 引擎 Oasis 负责人 烧鹅 55 |
56 |
65 | 83 | 每年双十一，我们既在忙碌和紧张中面对稳定性的挑战，又在并肩作战中感受快乐。 84 |
85 |98 | RichLab 99 | 全员每年践行阿里巴巴「公益时」。从社区服务，到环境清洁，向外界贡献技术之外的价值。 100 |
101 |
108 | 121 | 代码不是生活的全部，我们在音乐、越野、运动、旅行等领域都可以大展身手。 122 |
123 |「{{ hobit.content }}」
132 |—— {{ hobit.quote }}
133 |如果你想成为我们的一份子，请点击 此处。
140 |我们期待一个独一无二的你。
141 |
149 | 62 | 63 |
64 | 65 | 66 | 虽然真山不知道怎么做出来，但他觉得很酷，WebGL，特效，渲染，这些于他只是浅尝辄止的世界，此刻显得有些陌生，不过，接着鹅叔就对他说了一句让他印象深刻的话： 67 | 68 | > “ __Oasis3D 的使命就是要把 3D 开发的荒漠变成绿洲，让每个前端工程师都能轻松开发专业的 3D 应用，让 Web 世界也能达到影视级的绚丽多姿。__” 69 | 70 | 71 | 多么美好的愿景！真山期待着有一天也能轻松地产出这样的动画，同时，这是真山第一次体会到：原来技术人员的梦想可以可以这般绚烂。 72 | 73 | 这让真山想到他过去一年在 RichLab 的一个作品 —— 一个面向蚂蚁前端开发者的营销研发框架 **Sherry**。很久以前，真山这样地聊过 Sherry： 74 | 75 | > “ __我们在开发 Sherry 的过程中，习惯了以用户视角倒过来看，首先思考用户期望的是什么？提示和文档要写成什么样才简洁易懂？当想清楚这些后，Sherry 就拥有了它的灵魂。__” 76 | 77 | 78 |  79 | 80 | 看着屏幕上朦胧的光与影，真山陷入了沉思，他似乎陷入了对 Sherry 愿景的构思中。 81 | 82 | 突然，“咔嚓”一声，几米开外的 @玄寂 给正在聊天的众人拍了一张照片，似乎引起了真山的注意，于是他走过去，开始跟玄寂交谈起来。 83 | 84 | 他对玄寂的第一印象是，一个技术一流、充满着复古气息的英俊男子，工作中，他研发了一个基于浏览器端的构建和调试方案： 85 | 86 |  87 | 88 | @玄寂 对该产品的介绍是： 89 | 90 | > “ __Gravity 是一套完全基于浏览器技术实现的预览和调试解决方案。它通过合理的运行时代码编译模式，完整的基于浏览器的文件系统，轻巧的包管理模式，让整个前端的研发模式被完整的移植到了浏览器内。__” 91 | 92 | 93 | 这个产品惊艳到了真山，因为他从来没有相关的经验，他也对此充满了兴趣。 94 | 95 | 更让真山想不到的是，原来玄寂还是一位实实在在的摄影与旅游达人，这和真山的兴趣不谋而合，于是，真山开始听着玄寂畅谈他关于旅行的轶事 —— 那些瞬间的美好，就如同他 VLOG 中的画面一样： 96 | 97 | 98 | 99 | 聊着聊着，一天就这样悄悄地过去了~ 100 | 101 | 102 | ##
134 | 
153 |
154 | [_https://myslide.cn/slides/10069_](https://myslide.cn/slides/10069)
155 |
156 | 
160 |
161 | [_https://react.w3ctech.com_](https://react.w3ctech.com)
162 |
163 | 
167 |
168 | [_https://vue.w3ctech.com/_](https://vue.w3ctech.com/)
169 |
170 | 
174 |
175 | [_https://vuefes.jp/2019/sessions/ulivz/_](https://vuefes.jp/2019/sessions/ulivz/)
176 |
177 | 
181 |
182 | [_https://seeconf.antfin.com/_](https://seeconf.antfin.com/)
183 |
184 | 
188 |
189 | [_http://d2forum.alibaba-inc.com/_](http://d2forum.alibaba-inc.com/)
190 |
191 | [ˌfedəˈreɪʃn] 使 JavaScript 应用得以在客户端或服务器上动态运行另一个 bundle 或者 build 的代码。
14 |
15 | > 原文：[Webpack 5 Module Federation: A game-changer in JavaScript architecture](https://medium.com/@ScriptedAlchemy/webpack-5-module-federation-a-game-changer-to-javascript-architecture-bcdd30e02669)
16 |
17 | ---
18 |
19 | **Module Federation 之于 JavaScript Bundler，如同 Apollo 之于 GraphQL。**
20 |
21 | > 在独立的应用之间共享代码的可伸缩解决方案从未如此方便，而且几乎不可能大规模实现。此前我们拥有的最成熟方案是 externals 或 DLLPlugin，它们强制把依赖集中于一个外部文件中。共享代码真的很麻烦，因为很多应用看似独立，却不是真正意义上的独立，可共享的依赖非常有限。此外，在单独打包的 Web 应用之间共享实际的特性代码往往并不可行、**无效**、且毫无益处。
22 |
23 | ## 那么什么是 Module Federation?
24 |
25 | 这是我发明并且赋予它最初形态的 JavaScript 架构，在我的联合创作者兼 Webpack 创始人的帮助下，它成为了 Webpack 5 Core 中最令人兴奋的功能之一（Webpack 5 有一堆很酷的东西，新的 API 强大又干净）。
26 |
27 |
40 | 
41 |
54 | 55 |
56 | 57 |
68 |
69 | 
181 |
182 | 
283 |
284 | 
293 |
294 | 
340 |
341 |