@tbjy/sypl-workshop-materials NPM

sypl-assets-workshop-materials

创建项目文档： https://lowcode-engine.cn/site/docs/guide/expand/editor/cli

一个面向 PC 的业务组件库

调试

启动调试

npm run lowcode:dev             # 打开开发环境，运行所有组件

构建

npm run lowcode:build

引用 1. 在业务项目中使用npm时，当最新的物料库版本无法进行安装时，使用以下命令单独安装

yarn add @tbjy/sypl-workshop-materials@lastest --registry https://registry.npmjs.org/
yarn add @tbjy/tbdx-react-uploadimg@lastest --registry https://registry.npmjs.org/

引用

// assets.json  >  packages
{
  "package": "@tbjy/sypl-workshop-materials",
  "version": "0.1.1",
  "library": "SyplMaterials", // 此处是项目中定义的
  "urls": [
    "https://unpkg.com/@tbjy/sypl-workshop-materials@0.1.1/build/lowcode/view.js",
    "https://unpkg.com/@tbjy/sypl-workshop-materials@0.1.1/build/lowcode/view.css"
  ],
  "editUrls": [
    "https://unpkg.com/@tbjy/sypl-workshop-materials@0.1.1/build/lowcode/view.js",
    "https://unpkg.com/@tbjy/sypl-workshop-materials@0.1.1/build/lowcode/view.css"
  ]
}

// assets.json  >  components
{
  "exportName": "TbjySyplWorkshopMaterialsMeta", // 此处跟 package 按规则生成的
  "npm": {
    "package": "@tbjy/sypl-workshop-materials",
    "version": "0.1.1"
  },
  "url": "https://unpkg.com/@tbjy/sypl-workshop-materials@0.1.1/build/lowcode/meta.js",
  "urls": {
    "default": "https://unpkg.com/@tbjy/sypl-workshop-materials@0.1.1/build/lowcode/meta.js"
  }
}

项目

目录结构

sypl-assets-workshop-materials
├── .storybook      // storybook 配置
├── lowcode         // lowcode 所需的配置项（低代码编辑平台，左侧，组件库显示的内容）
├── src  
│   ├── business-components   // 引用 components 下基础组件，二次组合、封装，提供给低代码平台或业务项目使用。
│   ├── components            // 公共页面组件
│   ├── typings               // 扩展 typescript 声明
│   ├── utils                 // 公用方法
│   ├── config                // 获取配置，环境等相关属性
│   ├── index.tsx             // 统一暴露组件，供低代码平台或业务项目使用
├── stories         // storybook 组件使用的案例（开发、测试使用） 
│
└── README.md       // 项目说明

更新日志

2023年04月19日15:13:12 v0.1.5 1. 提供 formStorage 对象，包含（set,get），可将 form 下所有值储存到 localStorage。 2. 将 utils 挂载到 window.materials.utils 上（如：window.materials.utils.formStorage.get({form})）。