feat: add plugins (#114)

docs/plugins/community-plugins.md

@@ -1,9 +1,5 @@
 # Community Plugins
 
-## Farm Plugins
-
-- [farm-pulgin-strip](https://github.com/CCherry07/farm-pulgin-strip): A Farm Rust plugin to remove `debugger` statements and functions like `assert.equal` and `console.log` from your code.
-
 ## Vite/Rollup Plugins
 
 Farm support `Vite/Rollup` plugins out of box. So `Vite/Rollup` or `unplugin` plugins can be used in Farm directly.

docs/plugins/official-plugins/dsv.mdx

@@ -0,0 +1,66 @@
+import CodeBlock from "@theme/CodeBlock";
+import Tabs from "@theme/Tabs";
+import TabItem from "@theme/TabItem";
+
+# @farmfe/plugin-dsv
+
+🍣 A Farm plugin which converts `.csv` and `.tsv` files into JavaScript modules with [d3-dsv](https://github.com/d3/d3-dsv).
+
+## Requirements
+
+This plugin requires an [LTS](https://github.com/nodejs/Release) Node version (v18.0.0+) and Farm v1.0.0+.
+
+## Installation
+
+<Tabs>
+  <TabItem value="npm" label="npm">
+    <CodeBlock>npm install @farmfe/plugin-dsv</CodeBlock>
+  </TabItem>
+  <TabItem value="yarn" label="yarn">
+    <CodeBlock>yarn add @farmfe/plugin-dsv</CodeBlock>
+  </TabItem>
+  <TabItem value="pnpm" label="pnpm">
+    <CodeBlock>pnpm add @farmfe/plugin-dsv</CodeBlock>
+  </TabItem>
+</Tabs>
+
+## Usage
+
+Create a `farm.config.js` [configuration file](https://www.farmfe.org/docs/config/configuring-farm) and import the plugin:
+
+```js
+import { defineConfig } from '@farmfe/core';
+import dsv from '@farmfe/plugin-dsv';
+
+export default defineConfig({
+  plugins: [
+    [
+      dsv()
+    ]
+  ],
+});
+```
+
+## Practical Example
+
+Suppose that you have a CSV (or TSV!) file which contains some information on delicious fruits:
+
+```csv
+type,count
+apples,7
+pears,4
+bananas,5
+```
+
+And suppose you'd like to import that CSV as an `Array` within some part of your code. After adding the plugin (as shown above), you may `import` (or `require`) the CSV file directly. The import will provide an `Array` of `Objects` representing rows from the CSV file:
+
+```js
+import fruit from './fruit.csv';
+
+console.log(fruit);
+// [
+//   { type: 'apples', count: '7' },
+//   { type: 'pears', count: '4' },
+//   { type: 'bananas', count: '5' }
+// ]
+```

docs/plugins/official-plugins/overview.md

@@ -1,4 +1,5 @@
 # Overview
+
 Farm officially provides a lot of useful plugins, including Rust plugins and JS plugins. Rust plugins are much faster than Js plugins, we recommend to use Rust plugins whenever possible.
 
 :::tip
@@ -9,6 +10,11 @@ Refer to [Using Plugins](/docs/using-plugins) for how to use plugins in Farm.
 
 * **[`@farmfe/plugin-react`](./react)**：Support React `jsx` and `react-refresh`.
 * **[`@farmfe/plugin-sass`](./sass)**：Support compiling `sass/scss` files.
+* **[`@farmfe/plugin-strip`](./strip)**：A Farm rust plugin to remove `debugger` statements and functions like `assert.equal` and `console.log` from your code.
+* **[`@farmfe/plugin-dsv`](./dsv)**：A Farm plugin which converts `.csv` and `.tsv` files into JavaScript modules with [d3-dsv](https://github.com/d3/d3-dsv).
+* **[`@farmfe/plugin-yaml`](./yaml)**：A Farm plugin which Converts YAML files to ES6 modules.
+* **[`@farmfe/plugin-virtual`](./virtual)**：A rust plugin for farm to easily use virtual module.
+* **[`@farmfe/plugin-react-components`](./react-components)**：On-demand components auto importing for React.
 
 ## Js Plugins
 
@@ -18,11 +24,8 @@ Refer to [Using Plugins](/docs/using-plugins) for how to use plugins in Farm.
 * **[`@farmfe/js-plugin-dts`](./js-dts)**：Support compiling `*.d.ts` files.
 * **[`@farmfe/js-plugin-sass`](./js-sass)**：Support compiling `sass/scss` files.
 
-
 ## Community Plugins
 
 If official plugins doesn't meet your needs, you can try [Community Plugins](../community-plugins)
 
 And of course check out [awesome-farm](https://github.com/farm-fe/awesome-farm) - you can also submit a PR to list your plugins there.
-
-

docs/plugins/official-plugins/react-components.mdx

@@ -0,0 +1,157 @@
+import CodeBlock from "@theme/CodeBlock";
+import Tabs from "@theme/Tabs";
+import TabItem from "@theme/TabItem";
+
+# @farmfe/plugin-react-components
+
+On-demand components auto importing for React.
+
+## Installation
+
+<Tabs>
+  <TabItem value="npm" label="npm">
+    <CodeBlock>npm install @farmfe/plugin-react-components</CodeBlock>
+  </TabItem>
+  <TabItem value="yarn" label="yarn">
+    <CodeBlock>yarn add @farmfe/plugin-react-components</CodeBlock>
+  </TabItem>
+  <TabItem value="pnpm" label="pnpm">
+    <CodeBlock>pnpm add @farmfe/plugin-react-components</CodeBlock>
+  </TabItem>
+</Tabs>
+
+## Usage
+`@farmfe/plugin-react-components` is a Rust plugin, you only need to configure its package name in `plugins` field in `farm.config.ts`.
+```ts {4}
+import { UserConfig } from '@farmfe/core';
+
+const config: UserConfig = {
+  plugins: ['@farmfe/plugin-react-components', { /** options here */}]
+}
+```
+
+## Features
+
+- 💚 Supports React out-of-the-box.
+- ✨ Supports both components and directives.
+- 🏝 Tree-shakable, only registers the components you use.
+- 🪐 Folder names as namespaces.
+- 🦾 Full TypeScript support.
+- 🌈 [Built-in resolvers](#importing-from-ui-libraries) for popular UI libraries.
+
+## Usage
+
+Use components in templates as you would usually do, it will import components on demand, and there is no `import` and `component registration` required anymore! If you register the parent component asynchronously (or lazy route), the auto-imported components will be code-split along with their parent.
+
+It will automatically turn this
+
+```tsx
+export function Main() {
+  return <HelloWorld msg="Hello React + Farm" />
+}
+```
+
+into this
+
+```tsx
+import HelloWorld from './src/components/HelloWorld'
+
+export function Main() {
+  return <HelloWorld msg="Hello React + Farm" />
+}
+```
+
+> **Note**
+> By default this plugin will import components in the `src/components` path. You can customize it using the `dirs` option.
+
+## TypeScript
+
+To get TypeScript support for auto-imported components.
+
+```ts
+Components({
+  dts: true, // enabled by default if `typescript` is installed
+})
+```
+
+Once the setup is done, a `components.d.ts` will be generated and updates automatically with the type definitions. Feel free to commit it into git or not as you want.
+
+> **Make sure you also add `components.d.ts` to your `tsconfig.json` under `include`.**
+
+## Importing from UI Libraries
+
+We have several built-in resolvers for popular UI libraries like **Ant Design**, **Arco Design**, and **Material UI**, where you can enable them by:
+
+Supported Resolvers:
+
+- [Ant Design](https://ant.design/)
+- [Arco Design](https://arco.design/react/docs/start)
+- [Material UI](https://mui.com/)
+
+```ts
+// farm.config.js
+
+import { UserConfig } from '@farmfe/core';
+
+const config: UserConfig = {
+  plugins: ['@farmfe/plugin-react-components', {
+        local: true,
+        resolvers:[
+          {
+            module: "antd",
+            prefix: "Ant"
+          },
+          {
+            module:"@arco-design/web-react",
+            prefix: "Arco",
+            import_style: true // style/index.js
+          }
+        ]
+  }]
+}
+```
+
+## Configuration
+
+The following show the default values of the configuration
+<strike>component</strike>
+```ts
+{
+  // relative paths to the directory to search for components.
+  dirs: ['src/components'],
+
+  // resolvers for custom components.
+  resolvers: [],
+
+  /**
+   * Components are introduced with Absolute or Relative path.
+   *
+   * @default Absolute
+   */
+  import_mode: "Absolute"
+
+  /**
+   * Is it valid for local components
+   *
+   * @default true
+   */
+  local: true,
+
+  /**
+   * import style `style/index.js` , also accepts a path for custom path (<Component>/**) with components
+   *
+   * @default false
+   */
+  importStyle?: boolean | string 
+
+  // generate `components.d.ts` global declarations,
+  // also accepts a path for custom filename
+  // default: `true` if package typescript is installed
+  dts: true,
+
+  // Filters for transforming targets (components to insert the auto import)
+  // Note these are NOT about including/excluding components registered - use `Regex` for that
+  include: ["src/components"],
+  exclude: ["node_modules"],
+}
+```

docs/plugins/official-plugins/strip.mdx

@@ -0,0 +1,103 @@
+import CodeBlock from "@theme/CodeBlock";
+import Tabs from "@theme/Tabs";
+import TabItem from "@theme/TabItem";
+
+
+# @farmfe/plugin-strip
+
+🍣 A Farm rust plugin to remove `debugger` statements and functions like `assert.equal` and `console.log` from your code.
+
+## Requirements
+
+This plugin requires an [LTS](https://github.com/nodejs/Release) Node version (v18.0.0+) and Farm v1.0.0+.
+
+## Installation
+
+<Tabs>
+  <TabItem value="npm" label="npm">
+    <CodeBlock>npm install @farmfe/plugin-strip</CodeBlock>
+  </TabItem>
+  <TabItem value="yarn" label="yarn">
+    <CodeBlock>yarn add @farmfe/plugin-strip</CodeBlock>
+  </TabItem>
+  <TabItem value="pnpm" label="pnpm">
+    <CodeBlock>pnpm add @farmfe/plugin-strip</CodeBlock>
+  </TabItem>
+</Tabs>
+
+## Usage
+
+Create a `farm.config.js` [configuration file](https://www.farmfe.org/docs/config/configuring-farm) and import the plugin:
+
+```js
+import { defineConfig } from '@farmfe/core';
+import strip from '@farmfe/plugin-strip';
+
+export default defineConfig({
+  // ...
+  plugins: [
+    [
+      strip({
+        // plugin options
+        functions:[ 'console.*', 'assert.*' ],
+        labels: ['unittest']
+      })
+    ]
+  ],
+  // ...
+});
+```
+
+## Options
+
+### `include`
+
+Type: `String | RegExp | Array[...String|RegExp]`<br/>
+Default: `['**/*.js']`<br/>
+Example: `include: '**/*.(mjs|js)',`<br/>
+
+A pattern, or array of patterns, which specify the files in the build the plugin should operate on.
+
+### `exclude`
+
+Type: `String | RegExp | Array[...String|RegExp]`<br/>
+Default: `[]`<br/>
+Example: `exlude: 'tests/**/*',`<br/>
+
+A pattern, or array of patterns, which specify the files in the build the plugin should _ignore_.
+
+### `debugger`
+
+Type: `Boolean`<br/>
+Default: `true`<br/>
+Example: `debugger: false,`<br/>
+
+If `true` instructs the plugin to remove debugger statements.
+
+### `functions`
+
+Type: `Array[...String]`<br/>
+Default: `[ 'console.*', 'assert.*' ]`<br/>
+Example: `functions: [ 'console.log', 'MyClass.Test' ],`<br/>
+
+Specifies the functions that the plugin will target and remove.
+
+_Note: specifying functions that are used at the begining of a chain, such as 'a().b().c()', will result in '(void 0).b().c()' which will generate an error at runtime._
+
+### `labels`
+
+Type: `Array[...String]`<br/>
+Default: `[]`<br/>
+Example: `labels: ['unittest'],`<br/>
+
+Specifies the [labeled blocks or statements](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/label) that the plugin will target and remove.
+
+_Note: the '**:**' is implied and should not be specified in the config._
+
+### `sourceMap`
+
+Type: `Boolean`<br/>
+Default: `true`<br/>
+Example: `sourceMap: false,`<br/>
+
+If `true`, instructs the plugin to update source maps accordingly after removing configured targets from the bundle.