前端架构 —— 快速入门第一个脚手架

简单开发一个前端脚手架

• 首先，创建一个文件夹，例如：demo-cli，然后通过npm命令进行初始化

cd demo-cli

npm init -y

•  然后在文件夹中新建一个bin目录，并新建一个index.js文件

 

• 按前面学习过的需要在脚手架入口文件中添加这段代码，index.js

#!/usr/bin/env node

• 然后需要在 package.json 中配置bin

{

  "name": "imooc-test",

  "version": "1.0.0",

  "description": "",

  "bin": {

    "demo-cli": "bin/index.js"

  },

  "main": "index.js",

  "scripts": {

    "test": "echo \"Error: no test specified\" && exit 1"

  },

  "keywords": [],

  "author": "",

  "license": "ISC"

}

• 配置完后需要把脚手架发布到npm，注意必须拥有npm账号

第一步：通过npm login 命令登录

第二步：通过npm publish 命令发布

• 这样就发布成功了，可以登录npm官网查看，确认发布成功后，可以在本地命令行工具尝试安装

npm i -g demo-cli

• 安装成功后直接运行脚手架，就可以输出入口文件的内容，因目前没有定义任何脚手架命令，所以直接输入脚手架名称就行

demo-cli