Mgc-script NPM

MGC-SCRIPT插件分享

工程结构

npm.io

支持node版本14.19.0 +

package.json中bin字段的作用

许多软件包都具有一个或多个要安装到 PATH 中的可执行文件。 bin 字段是命令名到本地文件名的映射。在安装时，npm 会将文件符号链接到 prefix/bin 以进行全局安装或./node_modules/.bin/本地安装。当我们使用 npm 或者 yarn 命令安装包时，如果该包的 package.json 文件有 bin 字段，就会在 node_modules 文件夹下面的 .bin 目录中复制了 bin 字段链接的执行文件。我们在调用执行文件时，可以不带路径，直接使用命令名来执行相对应的执行文件。例如vue-cli中 npm.io

集成组件介绍

Command

编写代码来描述你的命令行界面。 Commander 负责将参数解析为选项和命令参数，为问题显示使用错误，并实现一个有帮助的系统。

Commander 是严格的，并且会针对无法识别的选项显示错误。两种最常用的选项类型是布尔选项，和从参数中获取值的选项。

示例

const { Command } = require('commander');
const program = new Command();

program
  .name('string-util')
  .description('CLI to some JavaScript string utilities')
  .version('0.8.0');

program.command('split')
  .description('Split a string into substrings and display as an array')
  .argument('<string>', 'string to split')
  .option('--first', 'display just the first substring')
  .option('-s, --separator <char>', 'separator character', ',')
  .action((str, options) => {
    const limit = options.first ? 1 : undefined;
    console.log(str.split(options.separator, limit));
  });

program.parse();

inquirer

Inquirer.js试图为NodeJs做一个可嵌入式的美观的命令行界面，它是非常容易去处理以下几种事情的：

提供错误回调
询问操作者问题
获取并解析用户输入
检测用户回答是否合法
管理多层级的提示

inquire.js问题对象实体：

type：问题的类型，可以是 input、confirm、list、rawlist、expand、checkbox、password 或 editor。
name：问题的名称，用于存储用户的回答。
message：问题的描述，用于显示给用户。
default：问题的默认值，可选。
choices：问题的选项，只有当 type 是 list、rawlist、expand 或 checkbox 时才需要，可以是一个数组或一个函数。
validate：问题的验证函数，用于检查用户的回答是否合法，可选。
filter：问题的过滤函数，用于对用户的回答进行处理，可选。
transformer：问题的转换函数，用于对用户的回答进行格式化，可选。
when：问题的条件函数，用于判断是否显示该问题，可选。
pageSize：问题的分页大小，只有当 type 是 list、rawlist 或 expand 时才有效，可选。

示例

const questions = [{
        type: 'input',
        name: 'name',
        message: 'What is your name?',
        default: 'Anonymous'
    },
    {
        type: 'confirm',
        name: 'confirm',
        message: 'Do you like inquirer?',
        default: true
    },
    {
        type: 'list',
        name: 'language',
        message: 'What is your favorite programming language?',
        choices: ['JavaScript', 'Python', 'Java', 'C#', 'C++'],
        default: 'JavaScript'
    },
    {
        type: 'checkbox',
        name: 'skills',
        message: 'What skills do you have?',
        choices: [
            { name: 'HTML', checked: true },
            { name: 'CSS', checked: true },
            { name: 'JavaScript', checked: true },
            { name: 'Node.js' },
            { name: 'React' },
            { name: 'Vue' }
        ]
    },
    {
        type: 'password',
        name: 'password',
        message: 'Enter a password',
        mask: '*'
    }
];

ejs

类比handlebars、artTemplate、jade这些模板引擎等，ejs也是一个javascript模板引擎，这里就不比较它与其他模板引擎的性能做对比了，ejs语法过于朴实，如果你会写html和简单的javascript，或者你用jsx写过react，那么ejs对你来讲将轻而易举。只需简单的两步：

将%标签包裹的js语法写在html里将html后缀的文件后缀名替换成ejs

模版示例

import React, { useEffect, useState } from 'react'

export const <%= fileName %> = (props) => {
    
    return(
        <div>
            
        </div>
    );
};

解析示例

 const outputTemplateStr = await ejs.renderFile(path.resolve(dirname, `../../template/${type}.ejs`), {fileName})
 const err = await fs.outputFile(path.resolve(cwd, `${outputPath}/${fileName}.${judgeSuffix(type)}`), outputTemplateStr)