音乐分享:
初喜《冠军》 后喜《龙王》
(PS:听一次钢心乐队的演出后采访才知道 “龙王”隐喻的是一起喝酒的老铁。。。。)
——————————————————————————————————————————————————————————————————————
项目截图:
项目地址:https://github.com/uustoboy/create-cli
项目目录:
├── bin
│ └── cf.js
├── lib
│ ├── class.js
│ └── templates
├── node_modules
│
└── package.json
第一步 主要靠Commander 命令行框架 和 inquirer 交互命令
cf.js代码:(主要命令的配置)
#!/usr/bin/env node
'use strict';
const program = require('commander');
const appInfo = require('./../package.json');
const _class = require('../lib/class.js');
const log = console.log;
program
.version(appInfo.version)
.usage('创建简单前端项目! [options] <package>')
.parse(process.argv);
program
.command('delete')
.alias('del')
.description('删除操作')
.action((cmd,option) => {
_class(cmd,option);
})
program
.command('app [cmd]')
.alias('a')
.description('创建app项目文件夹')
.option('-y, --fast', '快速创建默认目录')
.action((cmd,option) => {
_class(cmd,option);
}).on('--help', function() {
// 图片文字 http://ascii.mastervb.net/text_to_ascii.php
log(" ___ __ _ ");
log(" .' ..] [ | (_) ");
log(" .---. _| |_ ______ .---. | | __ ");
log(" / /'`]'-| |-'|______|/ /'`] | | [ | ");
log(" | \__. | | | \__. | | | | ");
log(" '.___.' [___] '.___.'[___][___] ");
log();
log(' app 创建app项目文件夹');
log();
log(' -y, --fast 快速创建默认目录');
log();
});
program
.command('pc [cmd]')
.alias('p')
.description('创建pc项目文件夹')
.option('-y, --fast', '快速创建默认目录')
.action((cmd,option) => {
_class(cmd,option);
}).on('--help', function() {
// 图片文字 http://ascii.mastervb.net/text_to_ascii.php
log(" ___ __ _ ");
log(" .' ..] [ | (_) ");
log(" .---. _| |_ ______ .---. | | __ ");
log(" / /'`]'-| |-'|______|/ /'`] | | [ | ");
log(" | \__. | | | \__. | | | | ");
log(" '.___.' [___] '.___.'[___][___] ");
log();
log(' pc 创建pc项目文件夹');
log();
log(' -y, --fast 快速创建默认目录');
log();
});
//默认不传参数输出help
if (!process.argv[2]) {
program.help();
}
program.parse(process.argv);
class.js代码:(主要是处理交互命令执行)
'use strict';
const log = console.log;
const program = require('commander');
const Gitdownload = require('download-git-repo');
const download = require('download');
const path = require('path');
const fs = require('fs');
const inquirer = require('inquirer');
const fse = require('fs-extra');
const del = require('del');
const archiver = require('archiver');
const chalk = require('chalk');
const join = path.join;
module.exports = function(cmd,option) {
var promps = [];
let _path = getPath( cmd );
if( option._name == 'delete' ){
if( !isFile( _path ) ){
return log(chalk.yellow(`${cmd}不存在`));
}
promps.push({
type: 'confirm',
name: 'del',
message: '是否删除'+cmd
});
inquirer.prompt(promps).then(function (answers) {
if( answers.del ){
del([ _path ])
.then( (err)=>{
//if(err) return log(chalk.red(err));
log(chalk.green('删除完成!~'));
});
}
});
}else if( option._name == 'app' || option._name == 'pc' ){
if( isFile( _path ) ){
return log(chalk.yellow(`${cmd}已存在`));
}
if( option.fast ){
var answers = {
base : false,
framework : false,
sass:true
}
createInfo( answers,cmd,option);
}else{
createFile(cmd,option);
}
}
};
//判断文件/文件夹是否存在;
var isFile = ( _path ) => fse.pathExistsSync( _path )?true:false;
var getPath = ( _path ) => path.resolve( process.cwd(),_path );
function createInfo( answers,cmd,option ){
fse.ensureDir(cmd)
.then(() => {
let jsStr = '';
log(chalk.green(`${cmd}文件夹创建~`));
fse.ensureDir( join(cmd,'c') ).then(() => {
if( answers.base ){
let baseAs = join(__dirname,'..','lib/templates/',option._name,'base.css');
let baseBs = join(process.cwd(),cmd,'c','base.css');
fse.readFile(baseAs,'utf8').then(data=>{
var data = data;
fs.writeFile(baseBs,data,function(){
log(chalk.green('base文件创建~'));
})
});
// fse.ensureLinkSync( join(__dirname,'..','lib/templates/',option._name,'base.css'), join(process.cwd(),cmd,'c','base.css') );
// log(chalk.green('base文件创建~'));
}
});
fse.ensureDir( join(cmd,'j') ).then(() => {
//加载jquery.js;
if( answers.framework == 'jquery' ){
download('http://apps.bdimg.com/libs/jquery/1.8.3/jquery.min.js', path.join(cmd,'j') ).then(() => {
log(chalk.green('jquery文件创建~'));
});
jsStr = '<script src="j/jquery.min.js"></script>';
}
//加载zepto.js;
if( answers.framework == 'zeop' ){
download('http://apps.bdimg.com/libs/zepto/1.1.4/zepto.min.js', path.join(cmd,'j')).then(() => {
log(chalk.green('zepto文件创建~'));
});
jsStr = '<script src="j/zepto.min.js"></script>';
}
});
fse.ensureDir( join(cmd,'i') );
if( answers.sass ){
fse.ensureDir( join(cmd,'s') ).then(() => {
Gitdownload('uustoboy/base_mixins',join(cmd,'/s/base_mixins'),function(){
var txt = `@charset "UTF-8";
@import "./base_mixins/_base_mixins.scss";`;
fse.outputFileSync( join( process.cwd(),cmd,'/s/index.scss'), txt);
log(chalk.green('sass文件创建~'));
});
});
}
let as = join(__dirname,'..','lib/templates/',option._name,'index.html');
let bs = join(process.cwd(),cmd,'index.html');
fse.readFile(as,'utf8').then(data=>{
var data = data;
if(answers.base){
var c = data.replace(/<%getCSS%>/g,'<link rel="stylesheet" href="c/base.css">');
}else{
var c = data.replace(/<%getCSS%>/g,'');
}
if( answers.framework ){
var j = c.replace(/<%getJS%>/g,jsStr);
}else{
var j = c.replace(/<%getJS%>/g,jsStr);
}
fs.writeFile(bs,j,function(){
log(chalk.green('默认html文件创建~'));
})
});
});
}
function createFile(cmd,option){
var promps = [];
promps.push({
type: 'confirm',
name: 'base',
message: '创建base.css文件'
});
promps.push({
type: 'list',
name: 'framework',
message: '使用框架库',
choices:[
{
name: '不使用框架库',
value: false
},
{
name: 'jquery.js',
value: 'jquery'
},
{
name: 'zeop.js',
value: 'zeop'
}
]
});
promps.push({
type: 'confirm',
name: 'sass',
message: '是否使用sass'
});
inquirer.prompt(promps).then(function (answers) {
//log(answers)
createInfo(answers,cmd,option);
});
}
第二步 package.json 配置
"bin": { "cf": "bin/cf.js" },
第三步 添加到全局(如果报错很有可能是你的命令名系统本来有了需要你删除在按)
$ sudo npm install . -g
发布模块:
先注册npm账号:(填 用户名、用户密码、邮件)
$ npm adduser
如果注册登录:
$ npm login
发布模块:(第一次发布的时候最好在npm搜搜你package.json里‘name’有木有已经发的要不然发布不了,每一次要发布npm上必须要更改‘version’的版本号)
$ npm publish
(注意:如果npm源更改成淘宝镜像的要改回npm源,淘宝镜像源发布会报错发布不了,推荐使用 nrm 包查看、切换)
删除模板:
$ npm unpublish --force [name]
全局安装模块:
$ npm install [name] -g
参考资料:
极客学院 :《使用 Node.js 开发命令行工具》 (视频教学)