@modern-js/main-doc 2.1.0 → 2.2.0

package/en/docusaurus-plugin-content-docs/current/configure/app/source/disable-default-entries.md

@@ -1,28 +0,0 @@
----
-title: source.disableDefaultEntries
-sidebar_label: disableDefaultEntries
----
-
-- Type: `boolean`
-- Default: `false`
-
-Turn off the function of automatically identifying the application build entry according to the project directory structure. By default, the Modern.js will get the corresponding build entry according to the project directory structure.
-
-:::info
-By default, Modern.js will get the corresponding entry information according to the project directory structure. For details, please refer to [Entry](/docs/guides/concept/entries).
-After configuring the shutdown mechanism, you need to configure the custom entry with [`source.entries`](/docs/configure/app/source/entries).
-:::
-
-:::warning Warning
-Organizing your code according to the catalog specification provided by the Modern.js is recommended to make better use of the framework's capabilities and avoid some redundant configuration.
-:::
-
-Set the following to turn off the default behavior:
-
-```ts title="modern.config.ts"
-export default defineConfig({
-  source: {
-    disableDefaultEntries: true,
-  },
-});
-```

package/en/docusaurus-plugin-content-docs/current/configure/app/source/disable-entry-dirs.md

@@ -1,38 +0,0 @@
----
-title: source.disableEntryDirs
-
-sidebar_label: disableEntryDirs
----
-
-- Type： `string[]`
-- Default： `[]`
-
-By default, application entries are identified based on the'src 'directory, you can disable some directories from being identified as application entries with this option.
-
-For example, when the configuration and directory structure is as follows：
-
-```ts title="modern.config.ts"
-export default defineConfig({
-  source: {
-    disableEntryDirs: './src/one',
-  },
-});
-```
-
-```bash title="Project directory structure"
-└── src/
-    ├── one/
-    |    └── App.tsx
-    ├── two/
-    |    └── routes/
-    └── env.d.ts
-```
-
-When this option is not set, Modern.js will generate two entries based on the project directory:
-
-- one
-- two
-
-When this option is set, `src/one` will not be recognized as an entry directory.
-
-A common usage is to configure the `src/common`, `src/components` directories to this option to avoid these directories being recognized as application entries.

package/en/docusaurus-plugin-content-docs/current/configure/app/source/enable-async-entry.md

@@ -1,50 +0,0 @@
----
-title: source.enableAsyncEntry
-sidebar_label: enableAsyncEntry
----
-
-- Type: `boolean`
-- Default: `false`
-
-This option is used in the webpack Module Federation scenario.
-
-When this option is turned on, the Modern.js wraps the automatically generated asynchronous boundary via Dynamic Import, allowing the page code to consume remote modules generated by the module federation.
-
-## Background knowledge
-
-If you don't know webpack module federation, please read the official [Module Federation documentation](https://webpack.js.org/concepts/module-federation) first.
-
-## Example
-
-First, turn this option on in the configuration file:
-
-```ts title="modern.config.ts"
-export default defineConfig({
-  source: {
-    enableAsyncEntry: true,
-  },
-});
-```
-
-Then execute the `dev` or `build` command, and you can see Modern.js automatically generated file becomes the following structure:
-
-```bash
-node_modules
-  └─ .modern-js
-     └─ main
-        ├─ bootstrap.js  #  real entry code
-        ├─ index.js      # asynchronous entry file
-        └─ index.html
-```
-
-The `index.js` reads as follows:
-
-```js
-import('./bootstrap.js');
-```
-
-At this point, you can consume any remote modules in the current page.
-
-:::info
-Modern.js the ModuleFederationPlugin of webpack is not encapsulated, please configure the ModuleFederationPlugin yourself through [tools.webpack Chain](/docs/configure/app/tools/webpack-chain).
-:::

package/en/docusaurus-plugin-content-docs/current/configure/app/source/entries-dir.md

@@ -1,38 +0,0 @@
----
-title: source.entriesDir
-sidebar_label: entriesDir
----
-
-- Type: `string`
-- Default: `./src`
-
-By default, the application entry will be identified according to the `src` directory. You can customize the identification directory of the application entry through this option.
-
-For example, when the configuration and directory structure are as follows:
-
-```ts title="modern.config.ts"
-export default defineConfig({
-  source: {
-    entriesDir: './src/pages',
-  },
-});
-```
-
-```bash title="Project directory structure"
-.
-└── src
-    └── pages
-        ├── a
-        │   └── App.jsx
-        └── b
-            └── App.jsx
-```
-
-Modern.js will generate the build entry `a` and entry `b` according to the `./src/pages` directory structure, the result is as follows:
-
-```js
- {
-   a: './src/pages/a/App.jsx',
-   b: './src/pages/b/App.jsx'
- }
-```

package/en/docusaurus-plugin-content-docs/current/configure/app/source/entries.md

@@ -1,122 +0,0 @@
----
-title: source.entries
-sidebar_label: entries
----
-
-- Type: `Object = { [ entryName: string ]: string | Object }`
-- Default: Default entry object dynamically settled according to the current project directory structure.
-
-For most scenarios, Modern.js automatically generated entries according to the directory structure can meet most business requirements. For details, please refer to [Entries](/docs/guides/concept/entries)。
-
-If you need to customize the build entry, you can specify it with this option.
-
-## String
-
-When the value is of type `string`, the file path of the entry:
-
-```ts title="modern.config.ts"
-import { defineConfig } from '@modern-js/app-tools';
-
-export default defineConfig({
-  source: {
-    entries: {
-      // Specify a new entry named entry_customize
-      entry_customize: './src/home/test/index.js',
-    },
-  },
-});
-```
-
-By default, the configured entry is equivalent to `App.[jt]sx`, that is, the specified entry file only needs to export the root component of the application.
-
-For example the following directory structure:
-
-```bash
-.
-├── src
-│   └── entry
-│       ├── chat.tsx
-│       └── home.tsx
-└── package.json
-```
-
-With the content of the above default entry mechanism, Modern.js when analyzing the above directory, will not get any default entry.
-
-In cases where you do not want to change the directory structure (such as project migration), you can customize the entry through `source.entries`:
-
-```ts title="modern.config.js"
-export default defineConfig({
-  source: {
-    entries: {
-      home: './src/entry/home.tsx',
-      chat: './src/entry/chat.tsx',
-    },
-  },
-});
-```
-
-## Object
-
-When the value is `Object`, the following properties can be configured:
-
-- `entry`：`string`，entry file path。
-- `disableMount`：`boolean = false`，turn off Modern.js generate entry code。
-
-```ts title="modern.config.ts"
-import { defineConfig } from '@modern-js/app-tools';
-
-export default defineConfig({
-  source: {
-    entries: {
-      entry_customize: {
-        // entry file path
-        entry: './src/home/test/App.jsx',
-      },
-      // Use Conventional Routing
-      entry_spa: {
-        // The entry path of a conventional route must be set to a directory
-        entry: './src/about',
-      },
-    },
-  },
-});
-```
-
-By default, the configured entry is equivalent to `App.[jt]sx`. If you want the entry to be equivalent to the entry in build mode, you can set the value to'Object' and the property `disableMount` to `true`.
-
-## Combine Entry
-
-When `source.entries` is specified, the Modern.js merges the user-defined entry with the default entry obtained by analyzing the directory structure. The merging rule is:
-
-Compare the entry path set by the custom entry with the default entry path. When the entry paths are the same, the custom entry will override the default entry.
-
-For example the following directory structure:
-
-```bash
-.
-├── src
-│   ├── chat
-│   │   └── App.jsx
-│   └── home
-│       └── index.js
-└── package.json
-```
-
-Modern.js analyze the `src/` directory to get the default entries `chat` and `home`. When the user configures the following in the `modern.config.js` file:
-
-```ts title="modern.config.ts"
-import { defineConfig } from '@modern-js/app-tools';
-
-export default defineConfig({
-  source: {
-    entries: {
-      index: './src/home/index.js',
-    },
-  },
-};
-```
-
-You can see that the path of the custom entry `index` is the same as the path of the default entry `home`. During the merging process, `index` will override `home`, and the final entry is as follows:
-
-- `chat -> ./src/chat/App.jsx`
-- `index -> ./src/home/index.js`

package/en/docusaurus-plugin-content-docs/current/configure/app/testing/transformer.md

@@ -1,18 +0,0 @@
----
-title: testing.transformer
-sidebar_label: transformer
-sidebar_position: 1
----
-
-- Type: `'babel-jest' | 'ts-jest'`
-- Default: `babel-jest`
-
-:::caution Caution
-First you need to enable the "Unit Test" function using [new](/docs/apis/app/commands/new) command.
-:::
-
-Configure the compiler for source code when executing tests: [babel-jest](https://www.npmjs.com/package/babel-jest) or [ts-jest](https://github.com/kulshekhar/ts-jest). `babel-jest` is used by default.
-
-:::info Additional information
-`Babel-jest` can also compile TS files, but there is no type error. If you need to check the TS type when running tests, then use `ts-jest`.
-:::

package/en/docusaurus-plugin-content-docs/current/configure/app/tools/esbuild.md

@@ -1,38 +0,0 @@
----
-title: tools.esbuild
-sidebar_label: esbuild
----
-
-- Type: `Object`
-- Default: `undefined`
-
-## Introduction
-
-:::tip About esbuild
-[esbuild](https://esbuild.github.io/) is a front-end build tool based on Golang. It has the functions of bundling, compiling and minimizing JavaScript code. Compared with traditional tools, the performance is significantly improved. When minimizing code, compared to webpack's built-in terser minimizer, esbuild has dozens of times better performance.
-:::
-
-Modern.js provides esbuild plugin that allow you to use esbuild instead of babel-loader, ts-loader and terser for transformation and minification process.
-
-## Configuration
-
-You can set the esbuild compilation behavior through the `tools.esbuild` config.
-
-```js title="modern.config.ts"
-import { defineConfig } from '@modern-js/app-tools';
-
-export default defineConfig({
-  tools: {
-    esbuild: {
-      loader: {
-        target: 'chrome61',
-      },
-      minimize: {
-        target: 'chrome61',
-      },
-    },
-  },
-});
-```
-
-For config details, please refer to [Modern.js Builder - Esbuild Plugin Configuration](https://modernjs.dev/builder/en/plugins/plugin-esbuild.html#config).

package/en/docusaurus-plugin-content-docs/current/configure/app/tools/jest.md

@@ -1,39 +0,0 @@
----
-title: tools.jest
-
-sidebar_label: jest
----
-
-- Type: `Object | Function`
-- Default: `{}`
-
-:::caution Caution
-First you need to enable the "Unit Test" function using [new](/docs/apis/app/commands/new) command.
-:::
-
-Corresponding to the configuration of [Jest](https://jestjs.io/docs/configuration), when of type `Object`, all underlying configurations supported by Jest can be configured.
-
-```js title=modern.config.js
-export default defineConfig({
-  tools: {
-    jest: {
-      testTimeout: 10000,
-    },
-  },
-});
-```
-
-When the value is of type `Function`, the default configuration is passed in as the first parameter and a new Jest configuration object needs to be returned.
-
-```js title=modern.config.js
-export default defineConfig({
-  tools: {
-    jest: options => {
-      return {
-        ...options,
-        testTimeout: 10000,
-      };
-    },
-  },
-});
-```

package/en/docusaurus-plugin-content-docs/current/configure/app/tools/swc.md

@@ -1,53 +0,0 @@
----
-title: tools.swc
-sidebar_label: swc
----
-
-- Type: `Object`
-- Default: `undefined`
-
-## Introduction
-
-[SWC](https://SWC.rs/) (Speedy Web Compiler) is a transformer and minimizer for JavaScript and TypeScript based on `Rust`. SWC can provide the same abilities with Babel, and it's more than 10x faster than Babel.
-
-Modern.js Builder has a out-of-box plugin for SWC, power your Web application with Polyfill and minification, we also port some common used Babel plugins to SWC.
-
-## Install
-
-The `@modern-js/plugin-swc` plugin needs to be installed before use.
-
-```bash
-pnpm add @modern-js/plugin-swc -D
-```
-
-After the installation，please register the SWC plugin in the `modern.config.ts` file, then the SWC compilation and compression will be enabled.
-
-```ts title="modern.config.ts"
-import appTools, { defineConfig } from '@modern-js/app-tools';
-import swcPlugin from '@modern-js/plugin-swc';
-
-export default defineConfig({
-  plugins: [appTools(), swcPlugin()],
-});
-```
-
-## Config
-
-You can set the SWC compilation behavior through the `tools.swc` config.
-
-```js title="modern.config.ts"
-import { defineConfig } from '@modern-js/app-tools';
-
-export default defineConfig({
-  tools: {
-    swc: {
-      jsMinify: {
-        compress: {},
-        mangle: true,
-      },
-    },
-  },
-});
-```
-
-For config details, please refer to [Modern.js Builder - SWC Plugin Configuration](https://modernjs.dev/builder/en/plugins/plugin-swc.html#config).

package/en/docusaurus-plugin-content-docs/current/configure/app/tools/tailwindcss.md

@@ -1,41 +0,0 @@
----
-title: tools.tailwindcss
-
-sidebar_label: tailwindcss
----
-
-- Type: `Object | Function`
-- Default: See configuration details below.
-
-<details>
-  <summary>TailwindCSS configuration details</summary>
-
-```js
-const tailwind = {
-  content: [
-    './config/html/**/*.html',
-    './config/html/**/*.ejs',
-    './config/html/**/*.hbs',
-    './src/**/*.js',
-    './src/**/*.jsx',
-    './src/**/*.ts',
-    './src/**/*.tsx',
-    './storybook/**/*',
-  ],
-  theme: source.designSystem, // Use source.design System configuration as Tailwind CSS Theme configuration
-};
-```
-
-:::tip Tips
-More about: <a href="https://tailwindcss.com/docs/configuration" target="_blank">TailwindCSS configuration</a>。
-:::
-
-</details>
-
-When the value is of type `Object`, rhe configuration corresponding to [TailwindCSS](https://tailwindcss.com/docs/configuration) is merged with the default configuration through `Object.assign`.
-
-When the value is of type `Function`, the object returned by the function is merged with the default configuration by `Object.assign`.
-
-The `theme` attribute is not allowed, otherwise the build will fail. Modern.js use [`source.designSystem`](/docs/configure/app/source/design-system) as the Tailwind CSS Theme configuration.
-
-Other uses are consistent with [Tailwind CSS](https://tailwindcss.com/docs/configuration)。

package/en/docusaurus-plugin-content-docs/current/configure/app/usage.md

@@ -1,92 +0,0 @@
----
-sidebar_position: 0
----
-
-# Configure to use
-
-There are two configurations in the Modern.js, a compile configuration and a server runtime configuration.
-
-The compile configuration can be configured in two places:
-
-- `package.json` file
-- `modern.config.t(j)s` file in the root path
-
-:::warning Warning
-Configurations in both `package.json` and `modern.config.t(j)s` file are not supported for the same configuration. Configuration in `modern.config. t(j)s` is recommended.
-:::
-
-Server runtime configuration can be configured in the `modern.server-runtime.config.t(j)s` file in the root path.
-
-## Configure in the configuration file
-
-Modern.js configuration files are defined in the root path of the project, and both `.js` and `.ts` formats are supported:
-
-- `modern.config.js`
-- `modern.config.ts`
-
-### modern.config.js
-
-You can use JavaScript syntax in the `modern.config.js` file and it is more flexible than in the `package.json` file.
-
-For example, you can define configuration options for function types in `modern.config.js`:
-
-```js title="modern.config.js"
-export default {
-  source: {
-    alias: opts => {
-      opts['@common'] = './src/common';
-    },
-  },
-};
-```
-
-You can also dynamically set it with `process.env.NODE _ENV`:
-
-```js title="modern.config.js"
-export default {
-  server: {
-    ssr: process.env.NODE_ENV === 'development',
-  },
-};
-```
-
-### modern.config.ts
-
-We recommend using configuration files in `.ts` format, which provides friendly TypeScript type hints to help you avoid configuration errors.
-
-Import the `defineConfig` tool function from `@modern-js/app-tools`, which will help you with configuration type derivation and type completion:
-
-```ts title="modern.config.ts"
-import { defineConfig } from '@modern-js/app-tools';
-
-export default defineConfig({
-  source: {
-    alias: {
-      '@common': './src/common',
-    },
-  },
-});
-```
-
-## Configure in package.json (not recommended)
-
-In addition to configuration files, configuration options can also be set the `modernConfig` field in the `package.json`, such as:
-
-```json title="package.json"
-{
-  "modernConfig": {
-    "source": {
-      "alias": {
-        "@common": "./src/common"
-      }
-    }
-  }
-}
-```
-
-Due to the limitation of the JSON file format, only simple types such as numbers, strings, boolean values, arrays, etc. can be defined in `package.json`. When we need to set the value of the function type, it is recommended to set it in the Modern.js configuration file.
-
-## Note
-
-- It is not recommended to use both `package.json` and `modern.config.t[j]s` for configuration. If both are used and a configuration conflict occurs, Modern.js will prompt error on the command line.
-- `@modern-js/runtime` exports the [defineConfig](/docs/apis/app/runtime/app/define-config) API of the same name, please pay attention to the distinction.

package/en/docusaurus-plugin-content-docs/current/guides/advanced-features/bff/bff-proxy.md

@@ -1,27 +0,0 @@
----
-sidebar_position: 5
-title: Use Proxy
----
-
-By configuring the BFF proxy, API requests can be forwarded without manual coding
-
-:::caution
-Using a BFF proxy ensures that requests can enter the BFF handler. (eg the request path must contain a bff prefix)
-:::
-
-Writing the following BFF proxy configuration in the `modern.server-runtime.config.js` file will proxy requests sent to `http://localhost:8080/api/v1/topics` to `https://cnodejs.org/api/v1/topics`.
-
-```js title="modern.server-runtime.config.js"
-import { defineConfig } from '@modern-js/app-tools/server';
-export default defineConfig({
-  bff: {
-    proxy: {
-      '/api/v1/topics': 'https://cnodejs.org',
-    },
-  },
-};
-```
-
-:::note
-For more detail, see [bff.proxy](/docs/configure/app/bff/proxy)。For more proxy info, see [Proxy](/docs/guides/basic-features/proxy)。
-:::