Community Plugins
Vite/Rollup Plugins​
Farm support Vite/Rollup
plugins out of box. So Vite/Rollup
or unplugin
plugins can be used in Farm directly.
Farm recommends to write Farm Plugins instead of Vite/Rollup
plugins for Farm. Because Farm Plugins have the best compatibility and performance. Still, PR welcome if you developed a Farm compatible plugin and you want to list it here.
using vitePlugins
in farm.config.ts
to configure Vite/Rollup
plugins.
import { UserConfig } from "@farmfe/core";
import vue from "@vitejs/plugin-vue";
import vueJsx from "@vitejs/plugin-vue-jsx";
const config: UserConfig = {
vitePlugins: [vue(), vueJsx()],
};
@vitejs/plugin-vue
: Vue support.@vitejs/plugin-vue-jsx
: Vue Jsx/Tsx support.vite-plugin-solid
: Solid support for Farm.vite-plugin-mock
: Mock data in both dev and prod.- ...
unplugin​
Currently you can use unplugin/farm
, unplugin/vite
and unplugin/rollup
in Farm. If you are using unplugin/vite
or unplugin/rollup
, some attributes may not have been fully adapted, or the Farm team believes that the api does not have the adaptation conditions, you can provide issues.
import Icons from "unplugin-icons/vite";
import IconsResolver from "unplugin-icons/resolver";
import Components from "unplugin-vue-components/rollup";
import { NaiveUiResolver } from "unplugin-vue-components/resolvers";
import { FileSystemIconLoader } from "unplugin-icons/loaders";
const config: UserConfig = {
vitePlugins: [
Icons({
compiler: "vue3",
customCollections: {
[collectionName]: FileSystemIconLoader(localIconPath, (svg) =>
svg.replace(/^<svg\s/, '<svg width="1em" height="1em" ')
),
},
scale: 1,
defaultClass: "inline-block",
}),
Components({
dts: "src/typings/components.d.ts",
types: [{ from: "vue-router", names: ["RouterLink", "RouterView"] }],
resolvers: [
NaiveUiResolver(),
IconsResolver({
customCollections: [collectionName],
componentPrefix: VITE_ICON_PREFIX,
}),
],
}),
],
};
All unplugin are supported in Farm:
- unplugin-auto-import
- unplugin-vue2-script-setup
- unplugin-icons
- unplugin-vue-components
- unplugin-upload-cdn
- unplugin-web-ext
- unplugin-properties
- unplugin-moment-to-dayjs
- unplugin-object-3d
- unplugin-parcel-css
- unplugin-vue
- unplugin-vue-macros
- unplugin-vue-define-options
- unplugin-jsx-string
- unplugin-ast
- unplugin-element-plus
- unplugin-glob
- unplugin-sentry
- unplugin-imagemin
- unplugin-typedotenv
- unplugin-fonts
- sentry-javascript-bundler-plugins
- unplugin-svg-component
- unplugin-vue-cssvars