Npm 包的搭建与发布

如果感兴趣，你可以把自己积累的函数库或者工具，放到 npm 上，然后安装到自己电脑终端，这样就可以很酷的使用了，我之前就把常用的一些项目脚手架模版 放到了公司的内网 npm 上，这篇文章就来介绍下如何发布和搭建一个npm 工具包。

发布 npm 包的流程

这里以私库为例

1. 配置私库 registry： npm config set @vipabc:registry http://npm.registry.*****.com/

2. npm login --registry=http://npm.registry.*****.com.cn/ --scope=@itutorgroup （之后按提示完成即可）或者：npm adduser --registry=http://npm.registry.*****.com.cn/ --always-auth

3. 发布包：npm publish （需要在package.json里指定包名为：”name”: “@*****/templateName”）

4. 取消发布包：npm unpublish [<@scope>/]<pkg>[@<version>] // 好像只能取消 24 小时内发布的包

使用方式：

这里以自己写的 crm-li 为例

1. 如果是公司的内网 npm，首先要切换源
2. npm i crm-cli -g
3. 查看版本 crm --version / V
4. 查看所有指令 crm -help / h
5. 查看模版列表 crm list
6. 基于 a 模板进行初始化 crm init a project-name

一个npm 脚手架模版的写法

效果图

核心 node 代码部分

讲解放到注释部分了

#!/usr/bin/env node
// 使用node开发命令行工具所执行的Javascript脚本必须在顶部加入 #!/usr/bin/env node 声明

const program = require('commander') // node 命令行处理工具?
const handlebars = require('handlebars') // 模板引擎处理字符串
const inquirer = require('inquirer') // 使用此模块可与命令行进行交互
const fs = require('fs') // Node.js内置的fs模块就是文件系统模块，负责读写文件
const ora = require('ora') // ora包用于显示加载中的效果,类似于前端页面的loading效果
const chalk = require('chalk') // 用于改变控制台中字符串到样式
const logSymbols = require('log-symbols')
const download = require('download-git-repo') // 下载 git 仓库代码 ?
const templates = require('./config')

// 1.获取用户输入命令
program.version('1.0.1')

program
  .command('init <template> <project>')
  .description('初始化项目模板')
  .action(function (templateName, projectName) {
    /**
     * 根据模板名下载对应的模板到本地
     * 下载之前做 loading 提示
     */
    const spinner = ora('正在下载模板...')
    spinner.start()

    /**
     * 第一个参数: 仓库地址
     * 第二个参数: 下载路径
     */
    const { downloadUrl } = templates[templateName]
    download(downloadUrl, projectName, { clone: true }, (err) => {
      if (err) {
        spinner.fail('下载模板失败') // 下载失败提示
        console.log(logSymbols.error, chalk.red('初始化模板失败' + err))
        return false
      }

      spinner.succeed('下载模板成功') // 下载成功提示

      /**
       * 把项目下的 package.json 文件读取出来
       * 使用向导的方式采集用户输入的值
       * 使用模板引擎吧用户输入的数据解析到 package.json 文件中
       * 解析完毕，把解析之后的结果重新写入 package.json 文件中
       */
      inquirer
        .prompt([
          {
            type: 'input',
            name: 'name',
            message: '请输入项目名称:',
          },
          {
            type: 'input',
            name: 'description',
            message: '请输入项目简介:',
          },
          {
            type: 'input',
            name: 'author',
            message: '请输入作者名称:',
          },
        ])
        .then((answers) => {
          // 把采集到的用户输入的数据解析替换到 package.json 文件中
          const packagePath = `${projectName}/package.json`
          const packageContent = fs.readFileSync(packagePath, 'utf8')
          const packageResult = handlebars.compile(packageContent)(answers)
          fs.writeFileSync(packagePath, packageResult)
          console.log(logSymbols.success, chalk.yellow('初始化模板成功'))
        })
    })
  })

program
  .command('list')
  .description('查看所有可用模板')
  .action(() => {
    // 根据模板名下载对应的模板到本地并起名projectName
    console.log('模板列表：')
    for (let key in templates) {
      console.log(`${templates[key].name} ${templates[key].description}`)
    }
  })

program.parse(process.argv)

复制代码