Yeoman&generator自定义脚手架

最新推荐文章于 2021-06-05 23:24:34 发布
最新推荐文章于 2021-06-05 23:24:34 发布
阅读量226 收藏
点赞数 1
分类专栏： 工具使用
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/CarrreyYan_979292/article/details/108413170
版权

制作属于自己 的脚手架

不是cli的脚手架。如果有过兴趣。自己可以使用node.js 中, ？？？？.js 自己写

gennerator 的脚手架方式

yo命令

官网地址：https://yeoman.io/yo

yeoman 制作脚手架命令

安装

npm install -g yo

yo 命令的作用是制作脚手架命令

yo --version 查看版本号
在这里插入图片描述

制作脚手架

*generater-generator 可以制作脚手架工具

npm install -g generator-generator

在这里插入图片描述

生成脚手架工具

yo gennerator-脚手架名称

在这里插入图片描述

制作中配置项目解释

在这里插入图片描述

脚手架创建成功

在这里插入图片描述

将自己的工程代码放入到脚手架中

1更改pack.json文件中version

在这里插入图片描述

2更改入口文件index.js中部分配置

在这里插入图片描述

3:开始导入自己的工程代码

在这里插入图片描述

  • 导入完成效果

在这里插入图片描述

本地测试脚手架是否

cd generator-shop-generator

npm link

在这里插入图片描述

  • 随便新建一个文件目录（模拟使用脚手架生项目工程）

在这里插入图片描述

  • 查看脚手架运行过程结果

在这里插入图片描述

发布脚手架

如果不会请自行百度

将 generator-shop-generator文件发布到npm上

npm login 使用命令登陆到npm

在这里插入图片描述

开始发布

npm publish

在这里插入图片描述

测试发布，并从npm 上使脚手架
  • 去npm官网搜索 generator-shop-generator

在这里插入图片描述

  • 在本地安装自己的脚手架

npm i generator-shop-generator
在这里插入图片描述

![在这里插入图片描述](https://img-blog.csdnimg.cn/2020090423231126.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NhcnJyZXlZYW5fOTc5Mjky,size_16,color_FFFFFF,t_70#pic_center)
  • 使用脚手架生成项目

yo shop-generator

![在这里插入图片描述](https://img-blog.csdnimg.cn/20200904232324429.png?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L0NhcnJyZXlZYW5fOTc5Mjky,size_16,color_FFFFFF,t_70#pic_center)
状元岐
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
基于yeoman实现自定义脚手架
weixin_51801245的博客
10-24 956
用yeoman 搭建你的个性化脚手架
制作属于自己的脚手架（图文详解）
qq_40137639的博客
09-04 1280
制作属于自己的脚手架（图文详解） yo命令 官网地址：https://yeoman.io/yo yeoman 制作脚手架命令 安装 npm install -g yo yo 命令的作用是制作脚手架命令 yo --version 查看版本号 制作脚手架 *generater-generator 可以制作脚手架工具 npm install -g generator-generator 生成脚手架工具 yo gennerator-脚手架名称 制作中配置项目解释 脚手架创建成功 将自己的工程代码放入到脚
利用Yeoman编写自己的脚手架生成器
MrzhangxianshengJS的博客
11-22 1135
首先我们应该创建一个文件夹,请尽量避免在C盘创建,如果在C盘可能会导致安装npm包的权限问题导致失败,我们的文件夹命名一定要按照官方文档给的格式来例如: generator-name(name是自己命名的生成器名称); 所有所有的前提就是你要安装node,版本不能太低,建议安装最新版本的node;官网地址: https://nodejs.org/en/download/;请按照自己操作系统的32位...
Yeoman自定义简易脚手架
qt的博客
12-15 145
地址 ： https://gitee.com/qitian88/qftwork/tree/master/fed-e-task-02-01/%E7%AE%80%E6%98%93%E8%84%9A%E6%89%8B%E6%9E%B6 只是简单实现，可以在 app下新建多个文件 修改写入实现 主要实现依赖于 Yeoman自定义generator generator本质上就是一个npm模块，yeoman的generator必须是以generator-name的格式，如果不采用这种格式，yeoman后续就无法找到所
一步一步打造属于自己的脚手架
lyd的博客
06-05 209
预备知识 本地安装卸载包 在项目根目录下运行下面命令 # 安装 npm link # 卸载 npm unlink 命令行命令指定运行文件 package.json文件中bin字段指定 项目依赖包 chalk 打印出彩色字 commander 完整的 node.js 命令行解决方案 download-git-repo 下载仓库代码 handlebars 编译文件 inquirer 交互式命令行界面 ora 加载动画 update-notifier 更新通知 fi
yeoman-generator-atticus-js:我的Javascript项目的yeoman生成器
04-28
**Yeoman Generator Atticus-js: 为你的JavaScript项目构建基石** `yeoman-generator-atticus-js` 是一个专为JavaScript项目设计的Yeoman生成器。 Yeoman是一个开发工具，它帮助开发者快速设置新项目的结构，通过...
generator-reacttiny:yeoman生成自己项目文件脚手架(react)
05-19
你做什么自定义脚手架啊，先自行google去吧1.安装目录我的目录是：home/mike/mywork/study/gitcode/2.安装generator安装:在命令行输入：npm install -g generator-generator说明：yo generator 生成器一个新的生成器...
property-generator:Yeoman Generator用于属性文件
05-16
Yeoman是一个流行的开发工具，它简化了Web应用程序的起步阶段，通过提供可重用的脚手架来加速开发流程。在这个特定的场景中，这个生成器专注于属性文件的创建，这在很多IT项目中都是至关重要的，尤其是那些需要配置...
Node.js-Yeoman工程脚手架可以生成基础微服务项目CRUD代码
08-09
`hookszhang-generator-duiker-cb0b19c` 这个文件很可能是 Yeoman 的一个自定义生成器，由用户或社区成员开发，专门用于生成 Node.js 的微服务项目，并且已经包含了 CRUD 操作的模板。当开发者使用这个生成器时，只...
generator-office:Yeoman生成器，用于构建Microsoft Office相关项目
04-28
与其他Yeoman生成器一样，此生成器仅为Office加载项项目创建文件的脚手架。 您可以选择使用纯HTML，CSS和JavaScript或使用Angular或React创建Office加载项项目，还可以在JavaScript和Typescript之间进行选择。 注意...
yeoman工具的使用以及自定义脚手架
MoMo@blog
12-14 540
安装yeoman 1.安装yarn sudo: yarn: command not found npm install -g yarn 2.安装yo sudo yarn global add yo 3.安装generator-node sudo yarn global add generator-node 4.新建文件夹 yeoman-test 5.yo node 注意点 yarn 报错超时 unexpected error occurred: “https://registry.yarnpkg.com/y
开发自己的 yeoman 脚手架（generator-reactpackage）
sunscheung的博客
07-24 715
开发自己的 yeoman 脚手架（generator-reactpackage） 转自：https://juejin.im/entry/57c938510e3dd90063e3c725 想体验一把 Ubuntu 系统玩一下命令行？试试腾讯云上实验室吧 https://cloud.tencent.com/developer/labs 原文链接：http://luckyk
Yeoman官网新手教程:第三章 用生成器为你的项目搭建脚手架
Jax2000的博客
04-09 1959
我们已经用‘脚手架’这个词很多次了，可是你可能还是不知道这个词的含义。在Yeoman中，‘脚手架’是个多义词，他为我们有特殊的配置需求的web app创造基础文件。在这一章中，我们会看到Yeoman是怎么为我们的Angularjs应用配置各种选项，像选择性的使用第三发的库，像SASS， Bootstrap，只需要很少量的时间。 创建一个项目文件夹 创建一个文件夹，我们所有的工作都将在这个文件夹
自制脚手架所需基础node工具包
Equation
01-24 798
一、commander 1、安装 npm install commander --save 2、简单demo var program = require('commander'); program .version('0.1.0') .option('-p, --peppers', 'Add peppers') .option('-P, --pineapple',
Yoeman脚手架练习
知识改变命运，ヾ(◍°∇°◍)ﾉﾞ【求关注】
03-12 212
1.首先创建空文件夹：然后执行如下命令 2.查看版本号： 3.创建脚手架：npm install -g yo
使用yoeman创建一个脚手架
hzisw的博客
07-17 1163
yoeman创建一个脚手架 创建一个自己的模版工程，不要有node_modules文件夹 全局安装yo npm i -g yo 全局安装yoeman的脚手架工具npm i -g generator-generator 进入模版工程目录下运行yo generator按照提示一步一步的走下去 注意: 脚手架名字必须是generator-打头的 创建成功后会在目录下生成一个generator-vue文件夹 文件夹的目录结构是这样的 cd generators/app/templates
开发属于自己的yeoman脚手架（generator-reactpackage）
weixin_38170561的博客
09-04 85
自从前后端开始分离之后，前端项目工程化也显得越来越重要了，之前写过一篇搭建基于Angular+Requirejs+Grunt的前端项目教程，有兴趣的可以点这里去看 但是有些项目可以使用这种方式，但有些却不太适合，或者我们就是想要去尝试新的框架。比如最近我就尝试着使用了webpack+react+es6的方式开发项目，感觉很不错，然后很多项目都用了这种方式。所以为了不需要每次开发的时候都从...
使用yeoman搭建自己的脚手架
u012308481的博客
04-02 515
yeoman的简述yeoman官网地址 确切的说是使用yo. generator里面的内置函数就是每个阶段需要做的事情，而这些事情需要我们自己去编写，特别注意的是writing阶段的时候我们可以把模板编译出来生成文件到目标位置，很经常用 使用示例 待续 ...
yeoman-generator
最新发布
09-15
Yeoman 是一个流行的前端开发工具，它可以帮助开发者快速搭建和构建 Web 应用程序。 Yeoman 提供了一个脚手架工具，可以生成项目的基础结构和文件。开发者可以选择使用已有的模板，也可以自定义模板。Yeoman 还提供了丰富的插件，可以集成其他工具和框架，如 Grunt 或 Gulp。 使用 Yeoman，开发者可以通过命令行交互式地创建项目，并自动化执行常见的开发任务，如生成文件、编译代码、运行测试等。它能够提高开发效率，减少重复工作。 总结来说，Yeoman 是一个强大的前端开发工具，可以帮助开发者快速构建和管理 Web 应用程序的基础结构和代码。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值