npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@tbjy/sypl-workshop-renderer

v0.0.11

Published

商业评论 —— 低代码页面渲染器。可以通过这种形式将页面内嵌到各个业务系统中去

Downloads

32

Readme

使用说明

package.json

  1. 安装依赖 @tbjy/sypl-workshop-renderer
  2. 使用时
import WorkshopRenderer from @tbjy/sypl-workshop-renderer
// ****
// domain,path 为低代码平台提供 url 中的 pathname 部分
// host 默认为 activity.zhizhuan100.com,可改为 daily-activity.zhizhuan100.com 或 pre-activity.zhizhuan100.com
// ****

  return <WorkshopRenderer domain='it' path='role' host='https://daily-activity.zhizhuan100.com' />
  1. 除了组件外,还提供了 { appHelper, request, logger, common, config, aplus } 等定制过的函数和对象

常见问题

  1. react 版本冲突,渲染失败。 解决:业务项目,webpack 打包时 externals react 等依赖,再通过 cdn 引用
// webpack.config.js
externals: {
    "react": "var window.React",
    "react-dom": "var window.ReactDOM",
    "prop-types": "var window.PropTypes",
    "@alifd/next": "var window.Next",
    "@alilc/lowcode-engine": "var window.AliLowCodeEngine",
    "@alilc/lowcode-engine-ext": "var window.AliLowCodeEngineExt",
    "moment": "var window.moment",
    "../moment": "moment",
    "crypto-js": "var window.Crypto",
    "lodash": "var window._"
  },

// htmll入口
<script src="https://g.alicdn.com/code/lib/??react/16.14.0/umd/react.production.min.js,react-dom/16.14.0/umd/react-dom.production.min.js"></script>
<script src="https://asset.zhizhuan100.com/unpkg/moment/2.29.4/moment.min.js"></script>
<script src="https://g.alicdn.com/code/lib/crypto-js/3.1.9/core.min.js?file=core.min.js"></script>
<script src="https://g.alicdn.com/code/lib/crypto-js/3.1.9/md5.min.js?file=md5.min.js"></script>
<script src="https://g.alicdn.com/code/lib/prop-types/15.7.2/prop-types.js"></script>
<script src="https://g.alicdn.com/platform/c/??react15-polyfill/0.0.1/dist/index.js,lodash/4.6.1/lodash.min.js"></script>
// appHelper需antD的message等
<script src="https://g.alicdn.com/code/lib/antd/4.23.0/antd.min.js"></script>
  1. react 版本不能升级到17以及以上(低代码编辑页面需注意,预览页未发现问题)。 原因:升级到17后,低代码编辑页面,右侧无法弹出二级编辑侧边栏(如:antd 表格列,修改列更多信息栏无法弹出)

  2. 引用的业务项目必须通过 cdn 引用 antd. 原因:本组件,appHelper 引用了 antd 的 message 等,但打包时排除了 antd。

  3. 业务项目,目前必须通过 cdn 引用 antd,同时业务项目打包时不能排除 antd。(后续有空查看原因进行优化) 原因:a. workshopRenderer 组件排除了 antd 组件。需要业务项目加载 cdn 的 antd。b. cdn 引用的 antd,业务项目部分组件使用时异常。

版本更新

v0.0.3 第一个正式版,使用方案参考上面。 目前745Kb。

v0.0.5 URL以 domain/path 访问时,存在正常数据下,window.pageInfo 仍然为空;浏览器可能缓存 html,导致多次加载时,pageInfo为空。 解决:增加兼容逻辑,pageInfo 为空时,通过 request 尝试获取一次。

v0.0.6 发布时,向 umeng 增加自定义事件时,PageView_xxxx 添加参数 {type:'pageView'}

v0.0.7 2024年02月05日14:43:28 预览组件,aplus.init 时,可通过 pageInfo 里 umeng_app_key,来自定义。