@modern-js/main-doc 0.0.0-next-20230222140615 → 0.0.0-next-20230223050219

package/CHANGELOG.md

@@ -1,6 +1,6 @@
 # @modern-js/main-doc
 
-## 0.0.0-next-20230222140615
+## 0.0.0-next-20230223050219
 
 ### Patch Changes
 
@@ -19,4 +19,4 @@
 - Updated dependencies [88f7b340d]
 - Updated dependencies [107f674fd]
 - Updated dependencies [fae9d1bd8]
-  - @modern-js/builder-doc@0.0.0-next-20230222140615
+  - @modern-js/builder-doc@0.0.0-next-20230223050219

package/en/guides/advanced-features/rspack-start.mdx

@@ -0,0 +1,69 @@
+---
+title: Rspack Start
+sidebar_position: 12
+---
+
+# Rspack Start
+
+[Rspack](https://www.rspack.org/) is a Rust-based web bundler developed by the ByteDance Web Infra team. The core architecture of Rspack is aligned with the implementation of webpack, and provides out-of-the-box support for commonly used build features.
+
+Rspack optimizes compilation performance by:
+
+- Highly LTO optimized Native code.
+- Take full advantage of multi-core, and the entire compilation process is fully optimized for multi-threading.
+- On-demand compilation based on request (Lazy Compilation), reducing the number of modules per compilation to improve the speed of cold start.
+
+## Initializing an rspack project
+
+The Modern.js generator provides an interactive question-and-answer interface to initialize a project. To create an rspack project, simply select the **rspack** build tool by running:
+
+```bash
+$ npx @modern-js/create myapp
+? Please select the solution you want to create: Web App Solution
+? Development Language: TS
+? Package Management Tool: pnpm
+? Build Tools: rspack
+```
+
+After the project is created, you can experience the project by running `pnpm run dev`. For more project information, please refer to [Quick Start](/guides/get-started/quick-start.html).
+
+:::tip
+When using rspack as the bundler, the following features are currently not supported:
+
+- Server-side rendering (SSR)
+- Static Site Generation (SSG)
+- Micro Frontend.
+- Storybook debugging.
+
+:::
+
+## Migrating from webpack to rspack
+
+You can enable rspack build by running `pnpm run new`:
+
+```bash
+$ pnpm run new
+? Action： Enable features
+? Enable features： Enable rspack Build
+```
+
+After executing the command, enable the rspack build in `modern.config.ts`:
+
+```ts title=modern.config.ts
+import appTools, { defineConfig } from '@modern-js/app-tools';
+
+export default defineConfig<'rspack'>({
+  runtime: {
+    router: true,
+  },
+  plugins: [
+    appTools({
+      bundler: 'experimental-rspack',
+    }),
+  ],
+});
+```
+
+:::tip
+Migrating from webpack to rspack may have some differences in build and configuration capabilities. For more details, please refer to [Configuration Differences](https://modernjs.dev/builder/en/guide/advanced/rspack-start.html#migrating-from-webpack-to-rspack)
+:::

package/package.json

@@ -11,13 +11,13 @@
     "modern",
     "modern.js"
   ],
-  "version": "0.0.0-next-20230222140615",
+  "version": "0.0.0-next-20230223050219",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/",
     "access": "public"
   },
   "peerDependencies": {
-    "@modern-js/builder-doc": "0.0.0-next-20230222140615"
+    "@modern-js/builder-doc": "0.0.0-next-20230223050219"
   },
   "devDependencies": {
     "ts-node": "^10",
@@ -25,7 +25,7 @@
     "fs-extra": "^10",
     "@types/node": "^16",
     "@types/fs-extra": "^9",
-    "@modern-js/builder-doc": "0.0.0-next-20230222140615"
+    "@modern-js/builder-doc": "0.0.0-next-20230223050219"
   },
   "scripts": {
     "build": "npx ts-node ./scripts/sync.ts"

package/zh/guides/advanced-features/rspack-start.mdx

@@ -0,0 +1,69 @@
+---
+title: 使用 Rspack
+sidebar_position: 12
+---
+
+# 使用 Rspack
+
+[Rspack](https://www.rspack.org/) 是字节跳动 Web Infra 团队自研的 Rust Bundler，核心架构对齐 webpack 实现，并对社区常用的构建能力做了开箱即用的支持。
+
+Rspack 通过以下方式来提升编译性能：
+
+- 高度 LTO 优化的 Native code。
+- 充分利用多核优势，整个编译过程充分进行多线程优化。
+- 基于请求的按需编译（Lazy Compilation），减小每次编译的模块数目，以提升冷启动的速度。
+
+## 初始化 rspack 项目
+
+Modern.js 生成器会提供一个可交互的问答界面，只需将构建工具选择为**rspack**，即可创建一个 rspack 项目:
+
+```bash
+$ npx @modern-js/create myapp
+? 请选择你想创建的工程类型 应用
+? 请选择开发语言 TS
+? 请选择包管理工具 pnpm
+? 请选择构建工具 rspack
+```
+
+项目创建完成后，在项目中执行 `pnpm run dev` 即可体验项目。更多项目信息可参考[快速上手](/guides/get-started/quick-start.html)。
+
+:::tip
+使用 rspack 作为打包工具时，以下功能暂不支持使用:
+
+- 服务端渲染（SSR）
+- 静态站点生成（SSG）
+- 微前端（Micro Frontend）
+- Storybook 调试
+
+:::
+
+## 从 webpack 迁移至 rspack
+
+通过执行 `pnpm run new` 可启用 rspack 构建：
+
+```bash
+$ pnpm run new
+? 请选择你想要的操作 启用可选功能
+? 启用可选功能 启用「rspack 构建」
+```
+
+执行命令后，在 modern.config.ts 中开启 rspack 构建：
+
+```ts title=modern.config.ts
+import appTools, { defineConfig } from '@modern-js/app-tools';
+
+export default defineConfig<'rspack'>({
+  runtime: {
+    router: true,
+  },
+  plugins: [
+    appTools({
+      bundler: 'experimental-rspack',
+    }),
+  ],
+});
+```
+
+:::tip
+从 webpack 迁移至 rspack，会有一些构建和配置能力上的差异，详情可参考：[配置差异](https://modernjs.dev/builder/guide/advanced/rspack-start.html#从-webpack-迁移到-rspack)
+:::