美文网首页进击的前端
node搭建简易脚手架

node搭建简易脚手架

作者: 风小逸 | 来源:发表于2020-09-25 02:17 被阅读0次

脚手架工作过程

1.通过命令行交互询问用户问题
2.根据回答生成文件

初始化模块

1.初始化项目,在package.json添加bin入口
2.创建入口文件,添加#!/usr/bin/env node 标识

获取用户输入

使用inquirer模块进行交互

inquirer.prompt([
  {
    type:'input',
    name:'name',
    message:'project name?'
  }
]).then(answers => {
  
})
获取文件路径

使用path模块获取模板目录,_dirname代表项目当前目录,process.cwd()获取命令窗口目录

 const tmplDir = path.join(_dirname,'templates')
 const destDir = process.cwd()
将模板目录文件写到目标目录中

1.使用fs模块的readdir方法获取到模板文件的相对路径
2.使用模板引擎ejs的renderFile方法渲染文件
3.使用fs的writeFileSync方法写入到目标文件

 fs.readdir(tmplDir,(err,files)=>{
    if(err) throw err
    files.forEach(item=>{
      ejs.renderFile(path.join(tmplDir,item),answers,(err,res)=>{
        if (err) throw err
        fs.writeFileSync(path.join(destDir,item),res)
      })
    })
  })

完整代码

#!/usr/bin/env node

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

inquirer.prompt([
  {
    type:'input',
    name:'name',
    message:'project name?'
  }
]).then(answers => {
  //模板目录
  //_dirname是项目当前目录,process.cwd是命令行执行的目录
  const tmplDir = path.join(_dirname,'templates')
  const destDir = process.cwd()

  //将模板目录的文件写入到目标目录中
  //fs.readdir用于读取目录下的所有文件
  //ejs.renderFile方法参数:1.绝对路径 2.渲染参数 3.回调函数
  fs.readdir(tmplDir,(err,files)=>{
    if(err) throw err
    files.forEach(item=>{
      ejs.renderFile(path.join(tmplDir,item),answers,(err,res)=>{
        if (err) throw err
        fs.writeFileSync(path.join(destDir,item),res)
      })
    })
  })
})

相关文章

  • node搭建简易脚手架

    脚手架工作过程 1.通过命令行交互询问用户问题2.根据回答生成文件 初始化模块 1.初始化项目,在package....

  • 安装node-sass后运行报错

    vue安装node-sass编译报错 安装node-scss报错 安装node-scss报错 在搭建vue脚手架 ...

  • Vue从零开始

    一、vue-cli 脚手架搭建 vue 开发环境 安装 node.js,node.js 自带 npmNode.js...

  • 收藏的技术博客或网站

    1. 博文 Node+Koa2+Mysql 搭建简易博客 使用 Vue2.js + Node.js 搭建一个全栈项...

  • vue-cli 安装指南

    vue-cli的搭建 脚手架运行前需要: node环境、npm包管理工具 第一次搭建:步骤 1、node -v2、...

  • D3.js入门指南

    本章涵盖以下内容: ◆ 搭建简易的D3开发环境 ◆ 搭建基于NPM(Node Packaged Modules是N...

  • vue-cli脚手架项目构成

    这篇文章针对于已经会用脚手架搭建vue的同学,如果不会从vue脚手架搭建,可以先稍微了解下Node和es6,这样对...

  • Vue前后端分离项目开发参考

    搭建项目参考 前端 前期准备 node环境 搭建脚手架 安装需要的依赖:vue全家桶(vue-cli、vue-ro...

  • Node.js+Express (一) 环境搭建

    一、环境搭建 为搭建简易的在线注册系统,学习并使用Node.js+Express框架,以此记录前提需求: git ...

  • 搭建node 简易服务

    安装node 1、Node官网下载pkg安装包,点击安装即可,安装包包含nodejs和npm(node packa...

网友评论

    本文标题:node搭建简易脚手架

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