美文网首页
创建脚手架

创建脚手架

作者: JerrySi | 来源:发表于2021-12-25 12:51 被阅读0次

1.初始化

$ yarn init
$ yarn

2.package.json里面加上 "bin": "cli.js"

#!/usr/bin/env node

// Node CLI应用文件入口文件必须要这样的文件头
// 如果Linux 或者MacOS 系统下还需要把文件的读写权限为755
// 具体就是通过 chmod 755 cli.js 实现修改


// 实现脚手架的工作过程
// 1. 通过命令行交互询问用户问题
// 2. 根据用户回答的结果生成文件

// node中发起命令行交互 我们使用inquirer模块
// yarn add inquirer

const path = require('path')
const inquirer = require('inquirer')
const fs = require('fs')
const ejs = require('ejs')

inquirer.prompt([
    {
        type: 'input',
        name: 'name',
        message: 'Project name'
    }
]).then(anwsers =>{
    console.log(anwsers)

    // 模板目录
    const tmplDir = path.join(__dirname, 'templates')
    // 目标目录
    const destDir = process.cwd()

    fs.readdir(tmplDir, (err, files) => {
        if (err) throw err
        files.forEach(file => {
            console.log(file)

             // 通过模板引擎渲染文件,yarn add ejs
             ejs.renderFile(path.join(tmplDir, file), anwsers, (err, result) => {
                if (err) throw err
                console.log(result)

                // 将模板写入目标路径fs
                fs.writeFileSync(path.join(destDir, file), result)
             })
        })
    })
})

相关文章

  • 采用React+Ant Design组件化开发前端界面(一)

    基础知识 1.使用脚手架创建项目并启动 ​ 1.1 安装脚手架: ​ 1.2 使用脚手架创建项目: ​ ...

  • 2018-10-26

    1. 使用React脚手架创建一个React应用 1). react脚手架 xxx脚手架: 用来帮助程序员快速创建...

  • Maven脚手架搭建&使用

    本文简单介绍一下使用自己的脚手架创建工程 第一步 创建脚手架工程 创建脚手架工程 fly-bom 定义好模板(包、...

  • vue-cli搭建

    脚手架搭建 1、创建脚手架 2、创建新工程 3、选项 创建工程过程中,除了 install vue-routerr...

  • vue脚手架

    安装6.1.0版本(创建vue脚手架的方法) 安装8.11.2版本(创建脚手架方法)

  • Reactjs开发环境入门配置

    目录 官方脚手架创建项目 webpack构建项目 1. 官方脚手架创建项目 Create React App 是一...

  • angular环境安装与运行

    脚手架安装 创建项目 运行项目

  • react-从零开始创建项目

    1、全局安装脚手架 2、用脚手架工具创建项目 3、启动项目

  • 脚手架工具,Yeoman

    脚手架作用 创建项目基础结构,提供项目规范和约定 一条命令创建脚手架,完成项目目录分类 Yeoman Yeoman...

  • react脚手架

    安装react脚手架:cnpm install -g create-react-app 使用react脚手架创建a...

网友评论

      本文标题:创建脚手架

      本文链接:https://www.haomeiwen.com/subject/sdokqrtx.html