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

@discuzq.icu/sdk

v1.0.77

Published

discuz dsk

Downloads

3

Readme

Discuz-SDK

主要是用于 Discuz Q 项目的一些基础类库以及后端 API 的调用 后期应该会接入 i18n,monitor 等能力

构建

  1. 生成文档
$ npm run docs
  1. babel 转义
$ npm run build

API 开发时,初始文件创建方式

TODO: 说明:后期迁移到 discuz-cli 工具中,就可以直接使用 cli 命令了

  1. npm script 的方式
# 1. npm script
$ npm run dzq-sdk init api

  1. node bin 的方式
# node bin
$ npm link
$ dzq-sdk init api
# 如上同样的问答式的创建 api 文件的提示

本地开发

  1. 监听文件变化
$ npm run watch
# 然后可以进入到对应的 demo 文件夹中运行 demo 的开发命令即可,如:
# taro-demo
$ npm run dev:taro
# uniapp-demo
$ npm run dev:uniapp
# nextjs-demo
$ npm run dev:next
  1. demo 测试

目前可以使用 npm link 的方式来模拟真正的引入方式进行本地的测试 1)在项目根目录中运行命令:npm link 2)在 examples 中的项目中关联引用本地开发的库:npm link @discuzq.icu/sdk 3)在代码中进行包引入,例如:

// 可以使用 `npm link` 的方式来模拟真正的引入方式进行本地的测试
import { getForum } from '@discuzq.icu/sdk/dist/api/forum/get-forum';
// 也可以直接使用本地路径的方式来引入
// import { getForum } from '../../../src/api'
  • 如果是 uniapp 项目:在 vue.config.js 文件中进行相关的 webpack 设置

    const webpack = require('webpack');
    // 定义 discuz 环境变量
    const DISCUZ_ENV = process.env.VUE_APP_PLATFORM === 'h5' ? 'web' : 'uniapp';
    
    module.exports = {
      configureWebpack: config => {
        config.plugins = [
          ...config.plugins,
          new webpack.DefinePlugin({
            'process.env.DISCUZ_ENV': JSON.stringify(DISCUZ_ENV)
          })
        ]
      },
    };
  • 如果是 taro 项目:在 config/index.js 中设置:

    // 定义 discuz 环境变量
    const DISCUZ_ENV = process.env.TARO_ENV === 'h5' ? 'web' : 'mini';
    
    const config = {
      ... ...,
      defineConstants: {
        'process.env.DISCUZ_ENV': JSON.stringify(process.env.DISCUZ_ENV),
      },
      ... ...,
    }
  • 如果是 nextjs 项目:在 next.config.js 文件中设置:

    module.exports = {
      env: {
        DISCUZ_ENV: 'web',
      },
    }

开发时环境判断

  1. 统一构建变量(CLI、UI、SDK、Plugin)。利用 webpackdefinePlugin 定义的变量。这样在构建的时候只会根据环境变量来进行区别不同的环境依赖情况。
  • 1)process.env.DISCUZ_ENV === 'web':只构建 web 相关的依赖
  • 2)process.env.DISCUZ_ENV === 'mini':只构建小程序相关的依赖
  • 3)process.env.DISCUZ_ENV === 'uniapp':只构建 uniapp 相关的依赖
  1. 如果涉及到不同端使用库的开发,请注意要有入口文件进行不同环境的判断,如:
/**
|-- request
| |-- index.js
| |-- adapter
| | |-- taro.js
| | |-- uniapp.js
*/
import axios from 'axios';
import defaultConfig from './defaults';

const request = axios;

// 设置默认配置
request.defaults = { ...request.defaults, ...defaultConfig };

if (process.env.DISCUZ_ENV === 'mini') {
  // taro项目的小程序
  const adapter = require('./adapter/taro.js');
  request.defaults.adapter = adapter.taroAdapter;
}
if (process.env.DISCUZ_ENV === 'uniapp') {
  // 给 uniapp 项目预留的口子,主要是因为要兼容老的项目的使用
  const adapter = require('./adapter/uniapp.js');
  request.defaults.adapter = adapter.uniAdapter;
}

export { request };
export default request;

目录结构说明

|-- .vscode
|-- docs              // 生成的说明文档
|-- examples          // 项目 demo
|-- lib               // babel 编译之后生成的目录
|-- src               // 源代码
| |-- api             // api 接入
| | |-- index.js
| | |-- entry.js      // api 请求入口
| | |-- login         // 登录
| | |-- ... ...
| |-- request         // 请求
| |-- localstorage    // 本地缓存
| |-- utils           // 工具库
| | |-- type.js       // 类型判断
| | |-- index.js
| | |-- ... ...

依赖

  1. axios

TODO

    • [x] 工具库 request 封装(主要是在 axios 的基础上增加不同的适配器)
    • [ ] API 接入
    1. [x] API 入口请求文件
    2. [x] API 增加入参类型校验
    3. [ ] API 配置文件生成
    • [ ] 工具库 & 工具函数
      • [x] 本地缓存
      • [x] 类型判断
      • [x] 平台 Api 获取(主要是针对小程序的处理)
    • [ ] 单元测试
    • [ ] 构建
      • [x] babel
      • [ ] rollup 【require 问题】
      • [ ] webpack
    • [ ] 文档生成
      • [x] JSDoc
      • [ ] 其它:和 UI | CLI 统一
      • [ ] 可交互文档
    • [ ] 安装使用
      • [ ] 包引入【待和 UI | CLI 统一】
      • [ ] cdn 【待完善整包构建:rollup 或 webpack】