"use strict";(self.webpackChunkfes_js=self.webpackChunkfes_js||[]).push([[861],{4794:(a,n,s)=>{s.r(n),s.d(n,{data:()=>e});const e={key:"v-494b840e",path:"/reference/plugin/dev/",title:"插件介绍",lang:"zh-CN",frontmatter:{},excerpt:"",headers:[{level:2,title:"开始",slug:"开始",children:[]},{level:2,title:"创建插件",slug:"创建插件",children:[]},{level:2,title:"发布到 npm",slug:"发布到-npm",children:[]}],filePathRelative:"reference/plugin/dev/README.md",git:{updatedTime:1664436338e3,contributors:[{name:"winixt",email:"haizekuo@gmail.com",commits:1}]}}},2754:(a,n,s)=>{s.r(n),s.d(n,{default:()=>c});const e=(0,s(6252).uE)('

插件介绍

开始

一个插件是一个 npm 包,它能够为 Fes.js 创建的项目添加额外的功能,这些功能包括:

插件的入口是一个函数,函数会以 API 对象作为第一个参数:

export default (api)=>{\n    api.describe({\n        key: 'esbuild',\n        config: {\n            schema(joi) {\n                return joi.object();\n            },\n            default: {}\n        },\n        enableBy: api.EnableBy.config,\n    });\n}\n
1
2
3
4
5
6
7
8
9
10
11
12

API 对象是构建流程管理 Service 类的实例,api 提供一些有用的方法帮助你开发插件。

api.describe用来描述插件:

创建插件

第一步:安装create-fes-app
npm i -g @fesjs/create-fes-app\n
1
第二步:创建插件项目
create-fes-app pluginName\n
1

在询问Pick an template时选择Plugin!

第三步:进入插件目录 & 安装依赖
cd pluginName & yarn\n
1
第四步:启动编译
yarn dev\n
1
第五步:使用插件API完成你的插件!(可以参考其他插件理解api用法和场景)

发布到 npm

@fesjs/preset-@fesjs/plugin-@webank/fes-preset-@webank/fes-plugin-fes-preset-fes-plugin- 开头的依赖会被 Fes.js 自动注册为插件或插件集。

所以编写好的插件想发布到 npm 供其他人使用,包名必须是 fes-preset-fes-plugin- 开头。

',23),p={},c=(0,s(3744).Z)(p,[["render",function(a,n){return e}]])},3744:(a,n)=>{n.Z=(a,n)=>{const s=a.__vccOpts||a;for(const[a,e]of n)s[a]=e;return s}}}]);