An overview of the
Screen shot from CDNJS official website
This article mainly introduces: how to submit their own library to CDNJS, submission requirements, detailed submission steps and encountered problems and solutions.
The popular science
To explain what CDN is:
CDN is a content distribution network built on the network. Relying on the edge servers deployed in various places and through the function modules of load balancing, content distribution and scheduling of the central platform, users can obtain the content they need nearby, reduce network congestion and improve user access response speed and hit ratio. The key technologies of CDN mainly include content storage and distribution. — Baidu Baike
In plain English, to speed things up!
Common free CDN such as UNPkg and CDNJS. Unpkg will pull everything in NPMJS, which means it will do the CDN for everything you submit to NPMJS. In the words of the official website:
unpkg is a fast, global content delivery network for everything on npm.
But at home sometimes the speed is touching. At this time we have to mention CDNJS, what are the advantages of this product? Is the commonly used CDN in China, such as:
- BootCDN
- Baidu CDN
- Strange dance CDN
- … Almost all of them will go to CNDJS to synchronize data. Yes, as long as you publish to CDNJS, you have a lot of domestic CDNS, you deserve it.
One of his minor drawbacks is that submitting advantages is troublesome.
Let’s read CONTRIBUTING. Md first. (Of course, you don’t have to read it, because I’ve covered the necessary steps in this article.)
A necessary condition for
If you want to submit your own library to CDNJS, the following conditions must be met.
- Make sure it’s not a personal project.
- There are over 200 stars on Github or at least 800 downloads per month in NPM Registry.
- There must be at least one official publicly accessible repository and open source license
usepackage.json
Add a new filelibrary
The Fork warehouse
- Fork Fork warehouse
First fork into your own account on CDN’s Github homepage. If you have multiple accounts or organizations, there will be a popup where you can select the target of the form. The official CDNJS tutorial lets you clone locally, and he specifically recommends using sparse checkout because of the size of the repository (around 65 GB), but that’s still 2GB. It’s a little too big, so I’ll just do it on the web.
-
To Create a Branch named after your library, click the Branch: Master drop down box, enter the name of the library you want to add, and click the “Create Branch
from master” button. Create a branch
-
Go to the Ajax /libs folder
Local preparation
Then prepare a resource file locally named after your library (rsuite as an example).
- in
rsuite
Directory created in the root directorypackage.json
File, as follows
{" name ":" rsuite ", "filename" : "rsuite. Min. Js", "version" : "3.0.0 - alpha", "description" : "A suite of react components", "homepage": "http://rsuitejs.com/", "keywords": [ "react", "rsuite", "component", "react-component" ], "author": "Simon Guo <[email protected]>", "license": "MIT", "repository": { "type": "git", "url": "[email protected]:rsuite/rsuite.git" }, "npmName": "rsuite", "npmFileMap": [ { "basePath": "dist", "files": [ "**/*" ] } ] }Copy the code
- Place other files that need to be synchronized to the CDN in this directory
Field Description:
name
: Name, which can be lowercase and cannot be blank, and can be separated by a minus sign.filename
: The name of the main file.version
: Latest version number, please make sure you use Tag for version release.description
Library English introduction.homepage
: Home page.keywords
: Keyword.repository.url
: Repository URL (usually github address).license
: Licensing, such as MIT, GPL, BSD, etc.author
: Author name and email address.npmName
: NPM name. In order towww.npmjs.com/package/rsu…As an example, thenpmName:rsuite
.npmFileMap
: NPM file mapping. Configure the files that need to be synchronized to CDNJS here.basePath
Path:filese
: Available! (...).
To exclude files that you don’t need.
"Files" : "* * /! (*. + (flow | SCSS))" / / *. Ruled out flow and *. SCSS document]Copy the code
Pay attention to:
It is best to use this piece directly from your ownpackage.json
Documents, but don’t give them awayfiles
,dependencies
,peerDependencies
This type of field submission.
Failed the test
The above Settings are automatically updated from NPM, but if you want to update from Git, refer to the instructions
- Then put in the files you need to upload
rsuite
Folder.My resource display
Do not include version numbers in resource files. Multiple versions are separated by folders
# Bad name rsuite.3.0.0.min.js # Good name rsuite.min.jsCopy the code
In addition, UglifyJs is recommended for compression of JS files. Or you can use web-minify-Helper (which I haven’t).
Uploading resources
Go directly to your warehouse pageajax/libs
Path, just drag your folder into it. (The documentation says clickUpload File
Button, but not found.
File Uploading Interface
Add LibrayName@version w/ npm auto-update
Add [email protected] w/ npm auto-update
Copy the code
Submit Issues
After submitting Issues, add the [Request] field in the title because it is a Request, or add the [Author] field if you are the Author (or major contributor). Such as:
[Request] [Author] Add rsuite.js
Copy the code
As follows:
**Library name:** rsuite
**Git repository url:** [rsuite/rsuite][git-repository-url]
**npm package name or url** (if there is one): [npmjs.com/package/rsuite][npm]
**License (List them all if it's multiple):** [MIT][license]
**Official homepage:** [http://rsuitejs.com/][homepage]
**Wanna say something? Leave message here:** N/A
[license]:https://github.com/rsuite/rsuite/blob/master/LICENSE
[git-repository-url]: https://github.com/rsuite/rsuite
[homepage]:http://rsuitejs.com/
[npm]:https://www.npmjs.com/package/rsuite
Copy the code
translation
** [rsuite/rsuite][git-repository-url] ** NPM ** (if there is one): [npmjs.com/package/rsuite][NPM] ** License :** [MIT][License] ** Official homepage :** [http://rsuitejs.com/][homepage] * * want to say what the other, leave A message here: * * N/A (license) : https://github.com/rsuite/rsuite/blob/master/LICENSE/git repository - the url: https://github.com/rsuite/rsuite [homepage]:http://rsuitejs.com/ [npm]:https://www.npmjs.com/package/rsuiteCopy the code
Free interface
Submit a Pr
Be sure to use pull_request_template.md!! Please be sure to fill in carefully!! Translation:
Issue #12712: Note that if you are using a repository or package for distribution purposes, please also provide the URL and other relevant information, such as the source repository or popularity of the package. Git repository url (mandatory) : * official site address (optional) : * NPM repository address (optional) : * Authorization: * GitHub/Bitbucket popular (mandatory) : - Tracker number: NPM Download Statistics (optional) : - Yesterday download times: - last week download times: - last month download times: # Necessary check item * [] I am the author of this library * [] I would like to add CDNJS related links to my website or repository * [] This lib does not appear in CDNJS * [] There are no duplicate problems/merge requests * [] this lib There is notable awareness * [] more than 200 [stars/followers/spinoffs] on GitHub/Bitbucket * [] more than 800 downloads per month on NPM * [] The project has been published on a well-known platform (or on The git auto-update checklist * [] indicates that the git auto-update checklist * [] indicates that the git auto-update checklist * [] indicates that the git auto-update checklist * [] indicates that the git auto-update checklist * [] indicates that the git auto-update checklist * [] indicates the git auto-update checklist The first line of the commit checklist is less than 50 words long and is clear and understandable. * [] Replicated CDNJS repositories are not older than 3 days * [] Merge requests are from a non-master and meaningful branch * [] There are unrelated changes to separate * [] There are redundant changes to merge through rebase into a * [] there are at commit "Message" refers to the corresponding problem to make it automatically shut down * [] refers to the corresponding problem in the commit messageCopy the code
After that, there are two audits, the first robot audit, and then a human audit. This is my Pull Request
Correct mistakes
When there are mistakes, you have a bit of a tragedy. Because CONTRIBUTING. Md agreed:
- Don’t submit irrelevant
commit log
. - If you want to modify the submission, use
git commit --amend
/git rebase
Command to update your submission.
However,github
There’s no way to do this online,Changing a commit message.
That’s when you need to pull the warehouse locally. At this point, please usegit-sparse-checkoutThe pull. The steps are as follows:Git config core. SparseCheckout true # Set what you want to check out Git /info/sparse-checkout # echo '/ libs/rsuite/*' >>. Don't know if individual phenomenon) git remote add origin https://github.com/rsuite/cdnjs.git # branch switch to rsuite branch git checkout - b # rsuite pull git Pull Origin rSuite --depth 10 # As a result of the network speed touching, the suggestion sleeps in the evening hang up to pull, or pull to the server to pull back again first. (I played for more than 3 hours, just for your reference)Copy the code
The last thing that comes down is du minus d minus 1 minus h
6.4g./.git 3.6m./ Ajax 40K./.idea 6.4g.
6.4g is fine.
Then it is time to revise the content and submit it again for manual review.
After a lengthy review, the RSuite was finally submitted to the CDNJS address. Welcome to use rSuite, I believe that in a short time, you can use the major domestic CDN to introduce rSuite.
React Suite is an open source UI component library from the HYPERS front-end team and UX team that helps you quickly build an enterprise application.
Visit our website at rsuitejs.com