持续创作，加速成长！这是我参与「掘金日新计划 · 10 月更文挑战」的第24天，点击查看活动详情

十二、目录是否存在

引言

这里开始新的学习系列，动手搭建一个属于自己的 vue 脚手架

主要以 vue 官方的 vue cli 作为参考和学习

方便自己在后续创建 vue 项目时，不必总是复制粘贴

目录是否存在

上几节，我们学到了如何正确的使用 Commands，以及里面 option

这一节，我们在 Commands 中，新增一个新的 option，并且处理 目录是否存在

首先在我们的 lib\core\commands.js 文件下，将 create 方法里面的 action 操作，封装成一个新的文件来处理

const { createAction } = require('./action/create')

const create = (program) => {
  program
    .command('create <app-name>')
    .description('create a new project powered by wzms-cli')
    .option('-p, --preset <presetName>', 'Skip prompts and use saved or remote preset')
    .option('-d, --default','Skip prompts and use default preset')
    .action((name,options) => {
        createAction(program, name, options)
    })
}

这里再创建一个目录和文件，在 lib\core\ 创建一个 action 文件夹，里面创建一个 create.js 文件，用来处理 action 的操作

流程

• 判断当前输入的命令，是在哪个位置

  // 可以得到当前输入命令的位置
  process.cwd()
  

• 判断这个当前这个目录下，是否存在，我们创建项目的 name 文件或者目录

  // 通过 node 的 path 模块，进行文件的
  path.resolve(cwd, name || '.')
  
  // 通过 fs 模块，进行判断
  fs.existsSync()
  

获取路径

这个文件的 lib\core\action\create.js 的详细代码如下

const path = require('path')
const fs = require('fs-extra')

const createAction = async (program, name, options) => {
  const cwd = process.cwd()
  console.log(cwd)

  const targetDir = path.resolve(cwd, name || '.')
  console.log(targetDir)
  console.log(fs.existsSync(targetDir))
}

module.exports = {
  createAction
}

option 控制

上面成功的获取到了 项目路径，下一步判断 是否存在

在判断之前，我们这里再加一个 option ，来控制判断是否删除还是保留，相当于再复习下 option

在 lib\core\commands.js 文件夹里的 create 方法，添加 option 为 force 属性

    option('-f, --force', 'Overwrite target directory if it exists')

添加完成后，我们在 lib\core\action\create.js 的 createAction 方法中新增

  if (fs.existsSync(targetDir)) {
    if (options.force) {
      await fs.remove(targetDir)
    } else {
    }
  }

即可成功判断

总结

我们处理了 目录是否存在，并且通过我们传递的 option 参数来进行控制