前端快速模版开发

最新推荐文章于 2024-11-27 16:37:17 发布

无来往

最新推荐文章于 2024-11-27 16:37:17 发布

阅读量1k

点赞数

分类专栏：前端文章标签： javascript 前端快速开发前端模版前端

本文链接：https://blog.csdn.net/frank_come/article/details/84258139

版权

本文记录了一次通过Scion+Co实现前端模板脚手架的配置过程，以减少重复的项目初始化工作。介绍了如何安装Scion-CLI，定义配置，以及使用`add`、`delete`、`init`等命令来管理模板，特别是利用git操作进行模板代码的下载和构建。

摘要由CSDN通过智能技术生成

记录一次配置前台模版的工作

由于最近工作新建项目特别多，每次都要重新配置一些http.js 、 storage 、项目结构，是一件特别冗余的工作，所以我在网上查了一下别人的做法，采用了scion + co实现的简单模版脚手架

本质上只是对template.json的操作(读取、fs写入) + 执行terminal command（终端命令）

新建项目

本地安装好scion-cli npm install scion-cli -g

mac需要加上sudo执行安装命令

构建好项目目录

bin

scion

定义了scion的一些基本配置，可以照抄，定义了scion的一些命令行（scion add ...）

#!/usr/bin/env node --harmony
'use strict'
 // 定义脚手架的文件路径
process.env.NODE_PATH = __dirname + '/../node_modules/'

const program = require('commander')

 // 定义当前版本
program
    .version(require('../package').version )

// 定义使用方法
program
    .usage('<command>')
program
    .command('add')
    .description('Add a new template')
  .alias('a')
  .action(() => {
    require('../command/add')()
  })

program
    .command('list')
    .description('List all the templates')
    .alias('l')
    .action(() => {
        require('../command/list')()
    })

program
    .command('init')
    .description('Generate a new project')
  .alias('i')
  .action(() => {
    require('../command/init')()
  })
program
    .command('delete')
    .description('Delete a template')
    .alias('d')
    .action(() => {
        require('../command/delete')()
    })
  program.parse(process.argv)

  if(!program.args.length){
    program.help()
  }