By the end of this article, you’ll have learned to “develop,” “configure,” “publish,” and eventually have your own NPM package.

1. Initialize the NPM

The NPM init command is used to create the initial project. This information needs to be improved step by step:

Package Name: (npmtest) Version: (1.0.0) Description: Entry Point: (index.js) Test Command: Git repository: Keywords: author: license: (ISC)Copy the code

After creating package.json, we can start writing code with a bang.

2. Development Tips

2.1 debugging

How to debug is a pain point in development, many people will copy the code to node_modules and then debug the results, but we actually have a better way: “NPM link”, the process is as follows:

  1. Perform at the root directorynpm link
  2. Execute in the projectnpm link package-name
  3. This time in the project real-time accesspackage-name

This method cannot be used in YARN.

Release 3.

3.1 Creating/Logging In to an Account

First you need to register at www.npmjs.com/signup.

After the login is complete, run the NPM login command on the terminal and enter the account and password. The login is successful.

One thing to note here is that if the Taobao source has been set, it needs to be modified to the NPM source, and the following command is used to restore:

npm config set registry http://registry.npmjs.org
Copy the code

However, in view of the actual situation, it is actually too troublesome for us to switch between Taobao and NPM sources. A better solution is to configure the publishConfig field in package.json, and see the next paragraph for the configuration description.

3.2 package. Json configuration

This introduction:

  • publishConfig
  • main
  • files

publishConfig

Publish the configuration used.

"publishConfig": {
    "registry": "https://registry.npmjs.org/",
    "tag": "beta",
    "access": "public"
}
Copy the code
  • Registry source address
  • Tag Publishes the correspondingdist-tagThe label
  • If the access isscopedPackage must be set topublic(Except paid account)

main

The package’s entry execution file, which we would normally specify as index.js.

files

We need to control the size of the NPM package to avoid too much time during the installation process. Generally we output only compiled content, documents, styles, and so on.

The package.json files field controls what is included in the project. It can be set to an array of files or filenames.

In addition, we can also create.npmignore files in the root or subdirectory, writing the same way as gitignore.

Some files are impossible to ignore:

  • package.json
  • README
  • CHANGES / CHANGELOG / HISTORY
  • LICENSE / LICENCE
  • NOTICE
  • The file in the “main” field

The following files are ignored by default:

  • .git
  • CVS
  • .svn
  • .hg
  • .lock-wscript
  • .wafpickle-N
  • .*.swp
  • .DS_Store
  • . _ *
  • npm-debug.log
  • .npmrc
  • node_modules
  • config.gypi
  • *.orig
  • package-lock.json

3.3 Version Management

The version number follows the rules of semantic versioning. The version number consists of major.minor. PATCH. You can add the extended pre-release version number at the end.

  • MAJOR: When you make incompatible API changes,
  • MINOR: When you make backwards compatible functionality additions,
  • PATCH: When you do a backwards compatibility problem fix.

The version number can be manually changed or managed using the NPM version command:

// Assume the current version is V1.0.0 NPM version patch // V1.0.1 NPM version prepatch // V1.0.2-0 NPM version minor // V1.1.0 NPM version Major / / v2.0.0Copy the code

The complete NPM version command is as follows:

npm version [<newversion> | major | minor | patch | premajor | preminor | prepatch | prerelease [--preid=<prerelease-id>] | from-git]
Copy the code

If we want to generate a version number in the style 1.0.0-alpha.1, we can take the –preid:

npm version prerelease --preid=alpha
Copy the code

After we execute the NPM version, the script automatically changes the version number and creates commits and tags in Git. To disable this behavior, you can pass –no-git-tag-version to prevent it.

3.4 the tag

NPM tags are used to mark versions for different purposes. An NPM package will at least have the Latest tag, which we can customize for beta, preview, etc.

For example, if we have a test version to release, we can specify the dist tag as beta:

npm publish --tag beta
Copy the code

When we’re done testing and ready for release, we can evolve the beta to latest.

3.5 release

When everything is ready, we can enter the sprint for the package.

npm publish
Copy the code

Attention! Some people may say why I only see errors. Generally, at this time, we can do the following:

  • Registry checks for correctness
  • Is the package name@somescope/somepackagenameIn the form of
  • Whether the version number is not updated

If the packet belongs to an organization, namely @ somescope/somepackagename form package name, execute the command need to adjust for NPM publish – access to the public.

After much effort, we finally publish, but if we find a file is missing and it’s not worth it to publish another version, we can use NPM unpublish to cancel a package published within 24 hours. Unpublish is not recommended.

Best practices

  • Semantic – Release automatically generates changelog and versioning
  • Code specification + COMMIT specification magic-Lint
  • CGR Switches NPM and YARN sources

5. Scene explanation

  • Each release operation process
  • removetag

5.1 Release Process

  1. Develop the functionality and deliver the code
  2. npm version major or minor or patch
  3. npm publish

5.2 removetag

npm dist-tag rm <pkg> <tag>
Copy the code

Series of summary

  • What is the NPM series
  • What is the NPM series: two, install eighteen martial arts
  • What is the NPM series? How to publish your own NPM package
  • to be continued

What is the NPM series? How to publish your own NPM package