Skip to content

Commit

Permalink
docs: chrome devtools (#2292)
Browse files Browse the repository at this point in the history
  • Loading branch information
zhoushaw authored Apr 5, 2024
1 parent 06ea45d commit a7a148d
Show file tree
Hide file tree
Showing 7 changed files with 2,320 additions and 2,636 deletions.
81 changes: 0 additions & 81 deletions .github/workflows/deploy-website.yml

This file was deleted.

8 changes: 2 additions & 6 deletions apps/website-new/docs/en/guide/basic/chrome-devtool.mdx
Original file line number Diff line number Diff line change
@@ -1,8 +1,5 @@
# Chrome DevTools

In implementation 🚧

{/*
The `Microfrontend` architecture differs from the traditional monolithic application development model. Its characteristics of separate development, deployment, and debugging necessitate a new set of debugging tools to meet new usage scenarios, such as: how to verify the effect of modules in actual projects when developing `Module Federation`, whether the dependencies of `Module Federation` are reused with the host environment, which `Module Federation` modules are loaded on the current page, the dependency relationships of `Module Federation`, and how the data flow between `Module Federation` works.

`Chrome DevTools` provides the following capabilities:
Expand Down Expand Up @@ -32,7 +29,7 @@ Development and production environments:

## How to Install

1. Open the [Module Federation plugin detail page](https://chromewebstore.google.com/detail/module-federation-live-re/likboddddbpaicmnhpddhhjeclggkejj?hl=zh-CN&utm_source=ext_sidebar), and click the `Add to Chrome` button.
1. Open the [Module Federation plugin detail page](https://chromewebstore.google.com/detail/module-federation/aeoilchhomapofiopejjlecddfldpeom?hl=zh-CN&utm_source=ext_sidebar), and click the `Add to Chrome` button.

![](@public/guide/chrome-devtools/chrome-store-add-devtool.png)

Expand Down Expand Up @@ -78,8 +75,7 @@ You can open DevTools in a separate window.
- ✅ Configuration rules are checked.
- ✅ Configuration is filled in correctly, the page shows: Proxy configuration is effective, remote module retrieval is successful, the corresponding page has been automatically refreshed.

![](@public/guide/chrome-devtools/proxy-rule.png)

### Partial Configuration Complies with Rules

The plugin will filter out **modules that comply with the configuration rules** for proxying. */}
The plugin will filter out **modules that comply with the configuration rules** for proxying.
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
9 changes: 3 additions & 6 deletions apps/website-new/docs/zh/guide/basic/chrome-devtool.mdx
Original file line number Diff line number Diff line change
@@ -1,9 +1,6 @@
# Chrome Devtool

施工中🚧


{/* `微前端` 架构不同于传统单体应用的开发模式,其分开开发、部署、调试的特征使其需要一套新的调试工具来满足新的使用场景,诸如:在开发 `Module Federation` 时怎么验证模块在实际项目中的效果、 `Module Federation` 的依赖是否和宿主环境进行了复用、当前页面加载了哪些 `Module Federation` , `Module Federation` 的依赖关系、`Module Federation` 间的数据流转是怎么样的。
`微前端` 架构不同于传统单体应用的开发模式,其分开开发、部署、调试的特征使其需要一套新的调试工具来满足新的使用场景,诸如:在开发 `Module Federation` 时怎么验证模块在实际项目中的效果、 `Module Federation` 的依赖是否和宿主环境进行了复用、当前页面加载了哪些 `Module Federation``Module Federation` 的依赖关系、`Module Federation` 间的数据流转是怎么样的。

`Chrome Devtool` 提供了以下能力:

Expand Down Expand Up @@ -32,7 +29,7 @@

## 如何安装

1. 打开 [Module Federation 插件详情页](https://chromewebstore.google.com/detail/module-federation-live-re/likboddddbpaicmnhpddhhjeclggkejj?hl=zh-CN&utm_source=ext_sidebar), 点击 `添加到 Chrome` 按钮
1. 打开 [Module Federation 插件详情页](https://chromewebstore.google.com/detail/module-federation/aeoilchhomapofiopejjlecddfldpeom?hl=zh-CN&utm_source=ext_sidebar), 点击 `添加到 Chrome` 按钮

![](@public/guide/chrome-devtools/chrome-store-add-devtool.png)

Expand Down Expand Up @@ -80,4 +77,4 @@

### 部分配置符合规则

插件会筛选出**符合配置规则的模块**进行代理 */}
插件会筛选出**符合配置规则的模块**进行代理
6 changes: 6 additions & 0 deletions apps/website-new/netlify.toml
Original file line number Diff line number Diff line change
@@ -1,2 +1,8 @@
[build]
publish = "apps/website-new/doc_build"

[[redirects]]
from = "/*"
to = "/"
status = 200

19 changes: 10 additions & 9 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -29,8 +29,8 @@
"lint-fix": "nx format:write --uncommitted",
"trigger-release": "node -e 'import(\"open\").then(open => open.default(\"https://github.com/module-federation/universe/actions/workflows/trigger-release.yml\"))'",
"serve:next": "nx run-many --target=serve --all --parallel=3 -exclude='*,!tag:nextjs'",
"serve:website": "nx run website:serve",
"build:website": "nx run website:build.netlify",
"serve:website": "nx run website-new:serve",
"build:website": "nx run website-new:build",
"extract-i18n:website": "nx run website:extract-i18n",
"sync:pullMFTypes": "concurrently \"node ./packages/enhanced/pullts.js\"",
"app:next:dev": "nx run-many --target=serve --configuration=development -p 3000-home,3001-shop,3002-checkout",
Expand Down Expand Up @@ -69,7 +69,6 @@
"unplugin": "1.9.0"
},
"devDependencies": {
"terser-webpack-plugin": "^5.3.10",
"@antora/cli": "3.1.5",
"@antora/lunr-extension": "1.0.0-alpha.8",
"@antora/site-generator": "3.1.7",
Expand Down Expand Up @@ -103,16 +102,16 @@
"@nx/node": "17.2.8",
"@nx/react": "17.2.8",
"@nx/rollup": "17.2.8",
"@nx/rspack": "17.2.8",
"@nx/storybook": "17.2.8",
"@nx/vite": "17.2.8",
"@nx/web": "17.2.8",
"@nx/webpack": "17.2.8",
"@nx/rspack": "17.2.8",
"@rspack/dev-server": "^0.5.4",
"@rspack/core": "^0.5.4",
"@pmmmwh/react-refresh-webpack-plugin": "0.5.11",
"@rollup/plugin-alias": "5.1.0",
"@rollup/plugin-replace": "5.0.5",
"@rspack/core": "^0.5.4",
"@rspack/dev-server": "^0.5.4",
"@semantic-release/changelog": "^6.0.3",
"@semantic-release/exec": "^6.0.3",
"@semantic-release/git": "^10.0.1",
Expand All @@ -134,10 +133,11 @@
"@tailwindcss/forms": "0.5.7",
"@testing-library/react": "14.0.0",
"@types/adm-zip": "0.5.5",
"@types/chrome": "^0.0.260",
"@types/download": "8.0.5",
"@types/fs-extra": "9.0.6",
"@types/eslint": "~8.37.0",
"@types/express": "4.17.21",
"@types/fs-extra": "9.0.6",
"@types/jest": "29.5.12",
"@types/lodash.clonedeepwith": "^4.5.9",
"@types/lodash.get": "4.4.9",
Expand All @@ -149,7 +149,6 @@
"@types/webpack-sources": "3.2.3",
"@typescript-eslint/eslint-plugin": "6.21.0",
"@typescript-eslint/parser": "6.21.0",
"@types/chrome": "^0.0.260",
"@vitest/coverage-istanbul": "1.2.2",
"@vitest/coverage-v8": "1.2.2",
"@vitest/ui": "1.2.2",
Expand Down Expand Up @@ -216,6 +215,7 @@
"strip-ansi": "^6.0.0",
"swc-loader": "0.2.3",
"tailwindcss": "3.4.1",
"terser-webpack-plugin": "^5.3.10",
"ts-jest": "29.1.2",
"ts-node": "10.9.1",
"tslib": "2.6.2",
Expand All @@ -232,7 +232,8 @@
"wast-loader": "^1.11.5",
"webpack": "^5.90.0",
"webpack-virtual-modules": "0.6.1",
"whatwg-fetch": "^3.6.2"
"whatwg-fetch": "^3.6.2",
"yargs": "^17.7.2"
},
"config": {
"commitizen": {
Expand Down
Loading

0 comments on commit a7a148d

Please sign in to comment.