(window.webpackJsonp=window.webpackJsonp||[]).push([[156],{496:function(a,t,e){"use strict";e.r(t);var s=e(15),n=Object(s.a)({},(function(){var a=this,t=a._self._c;return t("ContentSlotsDistributor",{attrs:{"slot-key":a.$parent.slotKey}},[t("h1",{attrs:{id:"脚手架工程-scaffold-demo"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#脚手架工程-scaffold-demo"}},[a._v("#")]),a._v(" 脚手架工程 (Scaffold Demo)")]),a._v(" "),t("p",[a._v("Scaffold demo 包含了开源 UI 的 addon，其展示了如何自定义 UI 以及如何使用声明文件。该 demo 在 "),t("code",[a._v("./examples/UIExtension/scaffoldDemo")]),a._v(" 目录下。")]),a._v(" "),t("h2",{attrs:{id:"如何运行-demo"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#如何运行-demo"}},[a._v("#")]),a._v(" 如何运行 demo")]),a._v(" "),t("h3",{attrs:{id:"设置库"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#设置库"}},[a._v("#")]),a._v(" 设置库")]),a._v(" "),t("p",[a._v("在 demo 根目录下执行命令 "),t("code",[a._v("npm run setup")]),a._v("。")]),a._v(" "),t("p",[a._v("该命令执行了以下步骤:")]),a._v(" "),t("ul",[t("li",[a._v("将 "),t("code",[a._v("lib")]),a._v(" 目录作为本地 npm 仓库添加到依赖列表。")]),a._v(" "),t("li",[a._v("安装所有第三方依赖，这些依赖主要用于开发环境搭建。")])]),a._v(" "),t("h3",{attrs:{id:"运行-demo"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#运行-demo"}},[a._v("#")]),a._v(" 运行 Demo")]),a._v(" "),t("p",[a._v("执行命令："),t("code",[a._v("npm start")])]),a._v(" "),t("h2",{attrs:{id:"源码结构"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#源码结构"}},[a._v("#")]),a._v(" 源码结构")]),a._v(" "),t("p",[t("code",[a._v("src")]),a._v(" 文件夹包含如下内容：")]),a._v(" "),t("div",{staticClass:"language-text extra-class"},[t("pre",{pre:!0,attrs:{class:"language-text"}},[t("code",[a._v("│  addons.js                        --- 展示如何使用 foxit 提供的插件.\n│  index.js                         --- javascript 入口文件.\n│\n└─addonExample                      --- addon 的样例. \n    │  addon.info.json              --- addon 入口文件, 该文件指定了所有 addon 需要的其他文件.\n    │  index.css                    --- 样式表\n    │  index.js                     --- addon 的脚本入口文件。不能更改文件名。\n    │\n    ├─locales                       --- i18n 多语言文件\n    │      en-US.json\n    │      zh-CN.json\n    │\n    ├─stateHandlers                 --- 继承自 IStateHandler 的 State Handler 类 \n    │      addTextField.js\n    │\n    └─templates\n            custom-dialog.art       --- 自定义对话框的 art 模板.\n            tab-template.art        --- 自定义工具栏的 art 模板.\n")])])]),t("h3",{attrs:{id:"入口文件"}},[t("a",{staticClass:"header-anchor",attrs:{href:"#入口文件"}},[a._v("#")]),a._v(" 入口文件")]),a._v(" "),t("p",[t("code",[a._v("src/addonExample/index.js")]),a._v(" 是 addon 的脚本入口文件。有关详细信息，请查看 "),t("a",{attrs:{target:"_blank",href:"/examples/UIExtension/scaffoldDemo/src/addonExample/index.js"}},[a._v("源文件")]),a._v("。")])])}),[],!1,null,null,null);t.default=n.exports}}]);