zl程序教程

您现在的位置是:首页 >  Java

当前栏目

发布自己的npm包

2023-02-18 16:30:12 时间

注册npm账户


用户名,密码,邮箱后面发布会用到 注册完需要验证邮箱 会发送邮件至你注册的邮箱 按指示完成验证即可

新建项目


创建目录

mkdir package

切换目录

cd package

初始化npm

npm init -y

后续可在 package.json 文件中增加更改配置

安装ESlint


安装

npm i eslint

初始化配置

eslint --init

配置 Commitlint


安装 Commitlint 脚手架和 Git Hook 工具

npm install @commitlint/cli @commitlint/config-conventional husky --save-dev

根目录创建 .commitlintrc.js 文件

module.exports = {
  extends: ['@commitlint/config-conventional']
}

配置 Git Hook

// package.json

"husky": {
  "hooks": {
    "pre-commit": "eslint src --fix --ext .js",
    "commit-msg": "commitlint -e"
  }
}

打包、编译


webpack babel

npm install webpack webpack-cli --save-dev
npm install @babel/core @babel/preset-env babel-loader @babel/plugin-transform-runtime @babel/runtime-corejs3 --save-dev

根目录创建 webpack.config.js 配置babel-loader

const path = require('path');

module.exports = {
	entry: './src/index.js',
	output: {
		path: path.resolve(__dirname, 'dist'),
		filename: 'bundle.js',
		library: 'package',
		libraryTarget: 'umd',
	},
	module: {
		rules: [{
			test: /\.js$/,
			loader: 'babel-loader',
			exclude: /node_modules/,
		}]
	}
}

根目录创建 .babelrc

{
  "presets": [
    ["@babel/preset-env"]
  ],
  "plugins": [
    [
      "@babel/plugin-transform-runtime", {
      "corejs": 3
    }
    ]
  ]
}

开发


新建 src 目录 创建index.js

发布


npm login

依次输入用户名 密码 邮箱

npm publish

包名不能重复并合法 使用官方源 npm config set registry http://registry.npmjs.org 注册npm的邮箱需要验证