Envie sua biblioteca para cdnjs (versão 2022)

Tenha uma mentalidade de produtor . Não seja apenas um consumidor, use isso como uma doutrina e depois ressente-se de que o mundo não é perfeito quando você não consegue encontrá-lo.

fundo

cdnjs é um excelente serviço de CDN de software de código aberto, e o conhecido bootCDN é seu espelho doméstico. Portanto, após submeter ao cdnjs, ele pode ser acessado através do bootCDN.

Eu lancei o wangEditor5 (editor de rich text de código aberto) há mais de dois meses. Eu usei jsDelivr como um serviço de CDN no começo, mas ele morreu há algum tempo. Usando unpkg now , lembre-se vagamente de quando era instável 1-2 anos atrás.

Então, eu quero sincronizar wangEditor5 para cdnjs. Mas não encontrei a versão chinesa ao procurar as informações, ou estava desatualizada há vários anos, então encontrei as informações em inglês no github e as traduzi para referência de outras pessoas.

Os métodos pré-online 2020 não se aplicam mais

O cdnjs fez uma atualização do método de confirmação 2 anos atrás, portanto, ter muitas coisas desatualizadas não é aplicável.

imagem.png

Provavelmente significa:

O armazém cdnjs/cdnjs está atualmente limitado a operações de robôs (algumas operações automáticas) e não aceita mais pull requests. Se você ainda quiser continuar enviando repositórios para cdnjs, vá para cdnjs/packages ou outros repositórios de código aberto.

Na verdade, cdnjs/packages possui as regras de submissão mais recentes, que é o conteúdo a ser traduzido neste artigo.

comece a traduzir

Link original github.com/cdnjs/packa…

Diretório de documentação

  • Visão geral
  • Políticas, Regras e Orientações
  • 配置 lib 自动更新
    • 自动更新概述
    • 自动更新配置
  • 配置文件优化
  • 在 cdnjs 创建新 lib
    • fork cdnjs 仓库
    • 修改你的 fork
    • 遵循已有 lib 的规则
    • 使用浏览器修改
    • 创建 pull request
    • 修复 CI 报错
    • 审查与合并

概述

cdnjs/packages 是一个 github 仓库,其中包含了很多 JSON 文件,它们控制着各个 lib 在 cdnjs.cloudflare.com 的可访问性。

cdnjs 依赖于用户提交 pull request 和自动更新的方式,来收集和更新 lib 。它包含很多贡献者和提交记录,所以通过正确的程序来提交 lib 是至关重要的。

以下两种形式的 lib 可被配置为自动更新(如何配置下文再说)

  • 日常在 npm 上维护的
  • github 仓库,且有 tag 和 release 的

那些无法自动更新的 lib 将不再被 cdnjs 支持。

政策、规则和引导

cdnjs 可以托管任何生产版本的 JS 和 CSS lib,只要有合适的 license 。

cdnjs 支持常见的文件格式,如 JS, TS, CSS, SCSS, JSON, WASM, SWF, images, audio ,所有的文件格式参考这个 API api.cdnjs.com/whitelist

【注意】cdnjs 对新提交的 lib 有如下要求,符合一个即可:

  • npm 下载量 800+ 每月
  • github 仓库有 200+ star

配置 lib 自动更新

自动更新概述

日常在 npm 维护的包,以及在 github 有 tag release 的仓库,可以被配置为自动更新。一个 cdnjs 的脚本会定期运行(每小时一次),检查相应的 npm 包或 github release 是否有新的版本发布,并更新到 cdnjs 中。

每一个 cdnjs 都有一个 JSON 文件,其中包含了该 lib 的一些信息。自动更新就配置在这个 JSON 文件里,和其他配置信息在一起。

自动更新配置

  • autoupdate 一级属性,包含了所有自动更新的配置
    • source 如果是 npm 包则为 npm ,如果是 git 仓库则为 git
    • target npm 的名称,后者 git 仓库的 url
    • fileMap 数组或者对象,告诉 cdnjs 应该拷贝哪些文件
      • basePath 要拷贝文件的根目录
      • files 要拷贝的文件名,可以直接写名字(如 lodash.min.js)也可以用 *.js 形式

PS:如果在 files 中使用通配符,请一定严格填写,不要把一些无用的文件也包含进来,避免造成浪费。

npm 包 自动更新 配置示例
  "autoupdate": {
    "source": "npm",
    "target": "function-plot",
    "fileMap": [
      {
        "basePath": "dist",
        "files": [
          "*.js",
          "utils/*.js"
        ]
      }
    ]
  }

示例中 function-plot 包的目录结构如下

|__dist
| |__function-plot.js
| |__utils
| | |__plotter.js
|__bower.json
|__index.js
|__site.js
|__package.json
|__README.md
|__lib
| |__...
|__node_modules
| |__...
|__sandbox
| |__...

根据配置规则,自定更新程序将定位到 dist 目录(你在 basePath 配置了),然后拷贝其中的 *.jsutils/*.js(你在 files 中配置了)到 cdnjs 中。再去掉 dist 目录,最终的 cdnjs 的文件目录如下

|__ajax
  |__libs
    |__function-plot
      |__x.y.z
        |__function-plot.js
        |__utils
          |__plotter.js

其中 x.y.z 是版本号,和包的 package.json 文件中版本一致。

git 仓库 自动更新 配置示例
  "autoupdate": {
    "source": "git",
    "target": "git://github.com/mikehostetler/amplify.git",
    "fileMap": [
      {
        "basePath": "lib",
        "files": [
          "*.js"
        ]
      }
    ]
  }

配置中的这个 git 仓库有代码结构如下

|__demo
| |__...
|__docs
| |__...
|__external
| |__...
|__lib
| |__amplify-vsdoc.js
| |__amplify.core.js
| |__amplify.core.min.js
| |__amplify.js
| |__amplify.min.js
| |__amplify.request.js
| |__amplify.request.min.js
| |__amplify.store.js
| |__amplify.store.min.js
|__src
| |__...
|__test
| |__...
|__.gitignore
|__.jshintrc
|__GPL-LICENSE.txt
|__MIT-LICENSE.txt
|__bower.json
|__build.json
|__header.js
|__package.json
|__readme.md
|__test-jquery-versions.js
|__test-server.js
|__testswarm.json

根据配置规则,自定更新程序将定位到 lib 目录(你在 basePath 配置了),然后拷贝其中的 *.js (你在 files 中配置了)到 cdnjs 中。再去掉 lib 目录,最终的 cdnjs 的文件目录如下

|__ajax
  |__libs
    |__amplify
      |__x.y.z
        |__amplify-vsdoc.js
        |__amplify.core.js
        |__amplify.core.min.js
        |__amplify.js
        |__amplify.min.js
        |__amplify.request.js
        |__amplify.request.min.js
        |__amplify.store.js
        |__amplify.store.min.js

其中 x.y.z 是版本号。

配置文件优化

默认情况下,当有新文件被自动更新进来时,cdnjs 会对特定文件进行压缩。对于 JS CSS 文件,cdnjs 会压缩代码生成 filename.min.jsfilename.min.css 文件。对于图片文件,cdnjs 也会进行压缩处理,以节省 CDN 的带宽。

如果你想禁用这个功能,你可以通过在 JSON 文件中配置 optimization 来控制。这个配置是可选的。示例如下:

"optimization": {
    "js": false,
    "css": false,
    "png": false,
    "jpg": false
  }

在 cdnjs 创建新 lib

流程概述

  • Fork cdnjs/packages 仓库到你自己的 github 账户
  • 对这个仓库进行必要的修改
  • 提交一个 pull request 并附加合适的信息
  • 带 PR 合并之后,删除掉你 fork 的仓库

Fork cdnjs/packages 仓库

通过 github.com/cdnjs/packa… 来 fork 仓库到你自己的 github 账号,然后你就有如下仓库了 github.com/your-github…

PS:请注意你 fork 的是 cdnjs/packages 而不是 cdnjs/cdnjs ,后者现在不再受理 pull reqeust

修改信息

在你 fork 的仓库中修改信息,这些信息将被提交 pull request ,最后会被 cdnjs 维护人员审查、合并。

修改信息可以通过浏览器,也可以使用 git 下载到本地…… (译者:最基本的 git 操作,这里就不说了)

译者注:
这里所说的“修改信息”,应该就是在 packages 这个仓库中,选择一个合适的文件夹(根据 lib 首字母),增加自己包的 JSON 文件,文件格式参考现有的即可,例如这个 jQuery.x18n.json

遵守已有 lib 的规则

Ao enviar uma nova lib, consulte a nomenclatura e o formato da lib existente, de preferência o formato JSON da lib recém-adicionada.

Modificar usando um navegador

O Github é mais conveniente para adicionar e modificar arquivos em páginas da web, o que é muito adequado para esse cenário.

Vá para este diretório github.com/your-github… do seu repositório fork , vá para a pasta apropriada (de acordo com as iniciais da lib) e crie um novo arquivo JSON. O formato do arquivo refere-se aos existentes.

Criar solicitação pull

Depois de adicionar arquivos, você pode enviar commits e criar pull requests.

As informações do commit devem seguir o seguinte formato padrão, que é conveniente para o pessoal do cdnjs revisar:
Add <lib 的名字> w/ npm/git auto-update(escolha um por npm/gitconta própria )

A descrição do commit não é obrigatória.

Observe que , em vez de se comprometer com a masterramificação , escolha criar uma nova ramificação com um nome de ramificação apropriado, por exemplo.add-my-lib-name

Finalmente, basta criar um pull request, e a equipe do cdnjs irá revisá-lo o mais rápido possível.

Corrigir erro de CI

Para garantir a exatidão do formato de arquivo JSON enviado e a configuração de atualização automática correta, o CI (ações do github) será acionado automaticamente durante o PR.

Se o CI verificar o arquivo JSON ou estiver configurado incorretamente, ele será marcado como com falha. Neste ponto, você precisa reeditar o arquivo JSON e reenviar.

Revisar e Mesclar

Se a verificação de CI for bem-sucedida, o pessoal do cdnjs continuará a revisar manualmente o conteúdo do PR para garantir que não haja problemas.

Se não houver problemas com a revisão manual, o PR será mesclado e você poderá excluir o repositório bifurcado anteriormente.

Obrigado por sua contribuição para cdnjs.

A tradução termina

Finalmente, bem-vindo ao usar o editor de rich text de código aberto wangEditor5 .

Acho que você gosta

Origin juejin.im/post/7117210634101456910
Recomendado
Clasificación