如何使用nodejs搭建静态服务器快速搭建本地服务器

NodeJs本地搭建服务器,模拟接口请求,获取json数据 - 简书
下载简书移动应用
写了41488字,被176人关注,获得了292个喜欢
NodeJs本地搭建服务器,模拟接口请求,获取json数据
不知道你在项目开发过程中,有没有遇到过有过以下场景:
一般是前端先制作静态页面,同时服务器端创建数据库,搭服务器端架构,写接口;
当接口写完之后,前端或者后端才能嵌套页面。
但是,如果前端页面制作好了,后端接口还没有写好呢?或者如何让前端、后端各自做各自的事情,互相不影响?
能做到下面这样是不是很好呢?
——在进行完需求分析和详细设计后,前端、后端一同商量、制作出一份接口文档
(其中接口名、参数、返回值名称、返回值类型都定义好)
前端页面制作好之后,直接模拟出该接口的json文件,先去请求该文件,把页面绑定、业务逻辑都处理好。
等前端全部绑定好,同时后端接口写好后,我们只需要前端修改接口地址,其他不用做任何修改。
这样,是不是前端不用等后端接口全部写完才能开始剩下的工作。
1.创建一个最简单的项目
安装nodejs
新建一个文件夹,进入目录mkdir express
接下来安装 Expressnpm install -g express-generator@4
创建一个工程express helloworld
现在在express文件夹下就出现了helloworld项目
安装依赖cd helloworld
npm install
备注:执行npm install命令会将package.json文件中 dependencies 依赖列表中,
即可自动安装依赖列表中所列出的所有模块。
开启服务执行npm start命令
这样就可以在浏览器访问http://localhost:3000/
下面是浏览器中显示的内容
2.为什么浏览器中出现的内容是这样的呢?
首先我们打开app.js,然后可以找到这句话app.use('/', routes);
然后我们再看routes是什么,就可以往上找,找到var routes = require('./routes/index');
顺着这个,我们打开routes文件夹下的index.js文件,看看里面究竟写的是什么var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Express' });
module.exports =
原来框架是找到views文件夹下的index.jade文件渲染到前台页面
index.jade
extends layout
block content
p Welcome to #{title}
这里我们先不用管 模板引擎 的语法,试着修改修改index.js文件的内容,将title改为Hello world.var express = require('express');
var router = express.Router();
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Hello world.' });
module.exports =
在命令行中,按ctrl+c关闭服务,重新执行npm start,看界面中的结果
是不是很简单。
3.看到这里,可能有个疑问,我们怎么访问静态的html呢?很简单,下面一步步说来:
首先,我们看app.js中有没有这句话app.use(express.static(path.join(__dirname, 'public')));
有的话,则直接看下一步,没有就在app.js中添加这句话,记得添加后重启服务
接着,我们在项目的public文件夹下,新建一个html文件下(便于后期管理所有的静态页面),然后新建index.html,内容如下:&!DOCTYPE html&
&html lang="en"&
&meta charset="UTF-8"&
&title&demo&/title&
Hello world.
这样在浏览器中输入下面的地址,就可以访问了。http://localhost:3000/html/index.html
4.我们现在做到了能访问一个html文件,那我们如何模拟ajax请求,读取json文件中的内容,提前绑定页面呢?(不依赖后端接口写好)
为了方便项目管理,我们新建几个文件夹和对应的文件json文件夹及其对应的index.json文件
在javascripts文件夹下新建index.js
index.json
"code":"200",
"msg":"success"
fetch("../json/index.json").then(function(res) {
if (res.ok) {
res.json().then(function(data) {
console.log(data);
console.log("Looks like the response wasn't perfect, got status", res.status);
}, function(e) {
console.log("Fetch failed!", e);
在index.html中引入对应的文件&!DOCTYPE html&
&html lang="en"&
&meta charset="UTF-8"&
&title&demo&/title&
Hello world.
&script src="../javascripts/index.js"&&/script&
最后再打开访问打开控制台,我们可以看到打印出了我们想要的内容
5.最后附上项目结构
有关fetch的用法,可以查看GitHub上的 。
快动手尝试一下吧,以后前端开发再也不用等服务器端框架搭好,接口写好了。
如果对您有用,点个赞呗~
个人站点:/
打开微信“扫一扫”,打开网页后点击屏幕右上角分享按钮
被以下专题收入,发现更多相似内容:
简书程序员大本营
投稿须知:
1.本专题仅收录与程序有关的文章。
2.请在代码框里写代码,尽量保证可看性。
关注简书官...
· 93191人关注
前端开发学习、总结
· 1757人关注
· 107人关注
如果对您有用,点个赞呗~
个人站点:/
选择支付方式:快速搭建 Node.js 开发环境以及加速 npm - CNode技术社区
积分: 3950
一切都是最好的安排
快速搭建 Node.js 开发环境以及加速 npm
在公交车上刷微博,还是有很多同学在咨询:
如何快速搭建
无法打开的问题
于是我觉得应该写一篇文章解答所有这些起步问题,让新同学也能顺顺利利入门。
如果你想长期做
开发, 或者想快速更新
版本, 或者想快速切换
那么在非 Windows(如 osx, linux) 环境下, 请使用
来安装你的
开发环境, 保持系统的干净.
如果你使用 Windows 做开发, 那么你可以使用
osx, linux 环境
如果你是 windows 环境开发, 请跳过这里, 直接查看下一章.
直接从 github clone nvm 到本地, 这里假设大家都使用 ~/git 目录存放 git 项目:
$ cd ~/git
$ git clone https:/&#/creationix/nvm.git
配置终端启动时自动执行 source ~/git/nvm/nvm.sh,
在 ~/.bashrc, ~/.bash_profile, ~/.profile, 或者 ~/.zshrc 文件添加以下命令:
source ~/git/nvm/nvm.sh
重新打开你的终端, 输入 nvm
Node Version Manager
Show this message
nvm --version
Print out the latest released version of nvm
nvm install [-s] &version&
Download and install a &version&, [-s] from source
nvm uninstall &version&
Uninstall a version
nvm use &version&
Modify PATH to use &version&
nvm run &version& [&args&]
Run &version& with &args& as arguments
nvm current
Display currently activated version
List installed versions
nvm ls &version&
List versions matching a given description
nvm ls-remote
List remote versions available for install
nvm deactivate
Undo effects of NVM on current shell
nvm alias [&pattern&]
Show all aliases beginning with &pattern&
nvm alias &name& &version&
Set an alias named &name& pointing to &version&
nvm unalias &name&
Deletes the alias named &name&
nvm copy-packages &version& Install global NPM packages contained in &version& to current version
nvm install v0.10.24
Install a specific version number
nvm use 0.10
Use the latest available 0.10.x release
nvm run 0.10.24 myApp.js
Run myApp.js using node v0.10.24
nvm alias default 0.10.24
Set default node version on a shell
to remove, delete or uninstall nvm - just remove ~/.nvm, ~/.npm and ~/.bower folders
安装任意版本的
nvm 默认是从
下载的, 国外服务器, 必然很慢,
好在 nvm 以及支持从镜像服务器下载包, 于是我们可以方便地从七牛的 node dist 镜像下载:
$ NVM_NODEJS_ORG_MIRROR=https://npm.taobao.org/mirrors/node nvm install 4
于是你就会看到一段非常快速进度条:
######################################################################## 100.0%
Now using node v4.3.2
如果你不想每次都输入环境变量 NVM_NODEJS_ORG_MIRROR, 那么我建议你加入到 .bashrc 文件中:
export NVM_NODEJS_ORG_MIRROR=https://npm.taobao.org/mirrors/node
source ~/git/nvm/nvm.sh
然后你可以继续非常方便地安装各个版本的 node 了, 你可以查看一下你当前已经安装的版本:
windows 环境
直接从 github clone nvmw 到本地, 这里假设大家都使用 d:\git 目录存放 git 项目:
$ git clone https:/&#/hakobera/nvmw.git
设置 d:\git\nvmw 目录到你的 PATH 环境变量中:
set &PATH=d:\git\%PATH%&
重新打开你的终端, 输入 nvmw
Show this message
nvmw install [version]
Download and install a [version]
nvmw uninstall [version]
Uninstall a [version]
nvmw use [version]
Modify PATH to use [version]
List installed versions
nvmw install v0.6.0
Install a specific version number
nvmw use v0.6.0
Use the specific version
安装任意版本的
nvmw 默认是从
下载的, 国外服务器, 必然很慢,
以及支持从镜像服务器下载包, 于是我们可以方便地从七牛的 node dist 镜像下载:
$ set &NVMW_NODEJS_ORG_MIRROR=https://npm.taobao.org/mirrors/node&
$ nvmw install 4.3.2
于是你就会看到一段非常快速进度条:
######################################################################## 100.0%
Now using node v4.3.2
如果你不想每次都输入环境变量 NVMW_NODEJS_ORG_MIRROR, 那么我建议你在全局环境变量中增加它.
然后你可以继续非常方便地安装各个版本的 node 了, 你可以查看一下你当前已经安装的版本:
Current: v4.3.2
到此, 无论是 windows 环境, 还是 osx, linux 环境, 都能快速安装多个版本的 node 了.
同理 nvm , npm 默认是从国外的源获取和下载包信息, 不慢才奇怪.
可以通过简单的 ---registry 参数, 使用国内的镜像
$ npm --registry=https://registry.npm.taobao.org install koa
于是屏幕又哗啦哗啦地一大片输出:
$ npm --registry=https://registry.npm.taobao.org install koa
npm http GET https://registry.npm.taobao.org/koa
npm http 200 https://registry.npm.taobao.org/koa
npm http 200 https://registry.npm.taobao.org/negotiator
npm http 200 https://registry.npm.taobao.org/keygrip
koa[@0](/user/0).5.2 node_modules/koa
├── koa-compose[@2](/user/2).2.0
├── statuses[@1](/user/1).0.2
├── finished[@1](/user/1).1.1
├── escape-html[@1](/user/1).0.1
├── only[@0](/user/0).0.2
├── debug[@0](/user/0).8.0
├── fresh[@0](/user/0).2.2
├── type-is[@1](/user/1).0.1
├── delegates[@0](/user/0).0.3
├── mime[@1](/user/1).2.11
├── co[@3](/user/3).0.5
├── accepts[@1](/user/1).0.1 (negotiator[@0](/user/0).4.2)
└── cookies[@0](/user/0).4.0 (keygrip[@1](/user/1).0.0)
但是毕竟镜像跟官方的 npm 源还是会有一个同步时间差异, 目前 cnpm 的默认同步时间间隔是 15 分钟.
如果你是模块发布者, 或者你想马上同步一个模块, 那么推荐你安装
$ npm --registry=https://registry.npm.taobao.org install cnpm -g
通过 cnpm 命令行, 你可以快速同步任意模块:
$ cnpm sync koa connect mocha
呃, 我就是不想安装 cnpm cli 怎么办? 哈哈, 早就想到你会这么懒了, 于是我们还有一个 web 页面:
例如我想马上同步 koa, 直接打开浏览器:
或者你是命令行控, 通过 open 命令打开:
$ open https://npm.taobao.org/sync/koa
如果你安装的模块依赖了 C++ 模块, 需要编译, 肯定会通过
在第一次编译的时候, 需要依赖
源代码, 于是又会去 node dist 下载,
于是大家又会吐槽, 怎么 npm 安装这么慢…
好吧, 于是又要提到 --disturl 参数, 通过七牛的镜像来下载:
$ npm --registry=https://registry.npm.taobao.org --disturl=https://npm.taobao.org/mirrors/node install microtime
再次要提到 cnpm cli, 它已经默认将 --registry 和 --disturl 都配置好了, 谁用谁知道
写到这里, 就更快疑惑那些不想安装 cnpm cli 又吐槽 npm 慢的同学是基于什么考虑不在本地安装一个 cnpm 呢?
github 好慢
好了, 看到这里大家应该对 node 和 npm 已经没有速度慢的问题了.
github 慢, 或者说是它的资源 host 被堵而已, 大家可以通过简单的 hosts 映射解决:
185.31.16.184 github.global.ssl.fastly.net
为何最近访问国外网站这么慢?
听说是 APCN2 又断了:
(APCN2 以修复很久)
希望文本对你有用. :)
支持并期待着
好早呀, 期待.
属于占坑的美文~
占坑, 广告联系我~ 嘿嘿
搞掂了, 干活去
cnpm 还支持 gzip …
哈哈, 都忘记写这个最重要的特性了
npm安装用代理也不错。
npm config set proxy=http://127.0.0.1:8087
npm config set registry=http://registry.npmjs.org
难怪github最近慢的死
支持,感谢。
$ cnpm install koa
npm WARN install Refusing to install koa as a dependency of itself
厄, 我安装没问题啊
你在 koa 的项目文件夹下装 koa 是会报错的。。。它不是提示你了么
原来 我就莫名其妙 这错误报的 已解决 谢谢
npm 的问题
&script&alert("xss")&/script&
&script&alert("xss")&/script&//"
If you’re in China, maybe you should install it from our China mirror taobao npm:
$ npm install -g cnpm --registry=https://registry.npm.taobao.org
安装了cnpm也无法install,楼主给瞧瞧
[root@localhost node-sl]# cnpm install mongoose
npm http GET http:/&#pmjs.org/mongoose
npm http GET http:/&#pmjs.org/mongoose
npm http GET http:/&#pmjs.org/mongoose
npm http GET http:/&#pmjs.org/mongoose/download/mongoose-3.8.8.tgz
npm ERR! fetch failed http:/&#pmjs.org/mongoose/download/mongoose-3.8.8.tgz
npm http GET http:/&#pmjs.org/mongoose/download/mongoose-3.8.8.tgz
npm ERR! fetch failed http:/&#pmjs.org/mongoose/download/mongoose-3.8.8.tgz
npm http GET http:/&#pmjs.org/mongoose/download/mongoose-3.8.8.tgz
npm ERR! fetch failed http:/&#pmjs.org/mongoose/download/mongoose-3.8.8.tgz
npm ERR! network write ECONNRESET
npm ERR! network This is most likely not a problem with npm itself
npm ERR! network and is related to network connectivity.
npm ERR! network In most cases you are behind a proxy or have bad network settin
npm ERR! network
npm ERR! network If you are behind a proxy, please make sure that the
npm ERR! network 'proxy' config is set properly.
See: 'npm help config'
npm ERR! System Linux 2.6.32-431.11.2.el6.x86_64
npm ERR! command &node& &/usr/local/node/lib/node_modules/cnpm/node_modules/.bin
/npm& &--userconfig=/root/.cnpmrc& &--disturl=http:/&#pmjs.org& &--cache=/
root/.npm/.cache_cnpm& &--registry=http:/&#pmjs.org& &install& &mongoose&
npm ERR! cwd /mnt/hgfs/linux_root/node-sl
npm ERR! node -v v0.10.26
npm ERR! npm -v 1.4.6
npm ERR! syscall write
npm ERR! code ECONNRESET
npm ERR! errno ECONNRESET
npm ERR! Additional logging details can be found in:
/mnt/hgfs/linux_root/node-sl/npm-debug.log
npm ERR! not ok code 0
一直 --registry=http://r.cnpmjs.org
npm config set registry=http://registry.npmjs.org
每次重开一个终端,总是回到原来安装过的版本呢
别用 n 了,用 nvm 吧
NVM_NODEJS_ORG_MIRROR=http://npm.taobao.org/mirrors/node nvm install node/latest
我安装的时候到npm那一个步骤就出错了,是不是还要配置npm路径的环境变量,我看到装node的时候还是https,等到npm的时候又变成http了。这个怎么破?
改了get_npm.js里边的路径为 https还是不行(ps:这个富文本编译器 输入 _ n 就变成斜体字了)算不算个小bug。
C:\Users\Administrator&nvmw
Node Version Manager for Windows
Show this message
nvmw install [version] [arch]
Download and install a [version]
for [arch] architecture (optional)
nvmw uninstall [version]
Uninstall a [version]
nvmw use [version]
Modify PATH to use [version]
List installed versions
nvmw install v0.10.21
Install a specific version number of node.js
nvmw use v0.10.21
Use the specific version
nvmw install iojs
Install the latest version of io.js
nvmw install iojs-v1.0.2
Install a specific version number of io.js
nvmw use iojs-v1.0.2
Use the specific version io.js
nvmw install v0.10.35 x86
Install a 32-bit version
C:\Users\Administrator&nvmw install 0.10.35
Start installing node/v0.10.35 (x64) to D:\git\nvmw\v0.10.35
输入错误: 没有文件扩展“.js”的脚本引擎。
Download D:\git\nvmw\v0.10.35\node.exe from
/x64/node.exe failed
C:\Users\Administrator&nvmw install 0.10.35
Start installing node/v0.10.35 (x64) to D:\git\nvmw\v0.10.35
输入错误: 没有文件扩展“.js”的脚本引擎。
Download D:\git\nvmw\v0.10.35\node.exe from
/x64/node.exe failed
mac 10.10.4
nvm ls-remote 返回的是 N/A,node 和 iojs 皆是。
已在.zshrc 中加了export NVM_NODEJS_ORG_MIRROR=&&
有遇到过的吗?
看看 nvm 的版本,如果比较老,更新一下。另外,nvm 的返回时间是多久?如果比较久,可能网络堵塞导致的 N/A。
默认情况下,.zshrc 是不用做任何配置的。即使配置,配置成官方的源也没意思。
版本是0.23.0, 直接 clone 下来的。
没有返回时间耶,凭感觉大概是3-4秒。
怎么设置启动的默认node的
学校网速慢到我想哭了。。。
写得很好,简单明了。
好文呀, 果断收藏了
Windows 推荐使用
经测试不支持4.0以后的版本
为啥不用n,npm安装,操作又简单。
之前在国外npm install用得好顺畅,现在回到国内npm install用不了,用taobao.org的镜像也安装不了packages。
查/npm-debug.log也查不出问题来。ping
会有package loss,大家是否会出现此情况呢?
使用nvmw的时候报错了。
C:\Users\Administrator&nvmw install v4.4.3
Start installing node/v4.4.3 (x64) to e:\libs\nvmw\v4.4.3
Download from , and save
it as e:\libs\nvmw\v4.4.3\node.exe
404 Not Found
Download e:\libs\nvmw\v4.4.3\node.exe from
4.4.3/x64/node.exe failed
C:\Users\Administrator&
然后我到https://npm.taobao.org/mirrors/node/v4.4.3/去看了下,目录名字应该是win-x64而不是x64。
应该是个bug。
应该是的问题 很多 要修复这个问题但是没有被作者merge 而且作者修改了README说他再维护nvmw了。。
CNode 社区为国内最专业的 Node.js 开源技术社区,致力于 Node.js 的技术研究。
服务器赞助商为
,存储赞助商为
,由提供应用性能服务。
新手搭建 Node.js 服务器,推荐使用无需备案的Windows环境下NodeJS的安装和配置,解决找不到模块的问题
第一步:去官网下载NodeJS安装包
下载链接:&
第二步:安装
因为windows的管理员权限机制,所以这里不推荐安装在C盘,我在这里更改为了非系统盘。
第三步:检测安装成功
打开命令提示符,Git Bash或者刚刚安装好的Node.js command prompt
可以在程序目录里面找到
命令行界面
第四步:配置全局模块的存放路径
npm是NodeJS的模块管理,我们可以自己配置npm的全局模块的存放路径以及cache的路径,例如我希望将以上两个文件夹放在NodeJS的主目录下,便首先在NodeJs下建立&node global&及&node cache&两个文件夹。
接着在cmd中键入两行命令:
npm config set prefix &D:\nodejs\node global&
npm config set cache &D:\nodejs\node cache&
可以通过输入&npm config get prefix&来查看设置是否成功。
第五步:设置系统环境变量
打开系统环境变量对话框,如图所示:
由于改变了module的默认地址,所以用户变量都要跟着改变一下(用户变量&PATH修改为&刚才我们设置的全局模块存放路径&),要不使用module的时候会导致输入命令出现&&xxx不是内部或外部命令,也不是可运行的程序或批处理文件&这个错误&。
我使用的全局模块存放路径为&D:\nodejs\node global&(见上方设置的prefix&值),我将它添加到我的用户变量里面
同时在&系统变量&添加&NODE_PATH&变量,使用全局安装时,首先会在这个目录去寻找模块。
Paste_Image.png
第六步:测试安装模块Bower
在命令行输入&npm install bower -g&,稍等片刻后便会安装成功,再次在命令行输入&bower -v&,会出现正确的版本号,表示配置成功。
后续便可以轻松地使用npm管理工具来构建你自己的前端工作流了。
【声明】:黑吧安全网()登载此文出于传递更多信息之目的,并不代表本站赞同其观点和对其真实性负责,仅适于网络安全技术爱好者学习研究使用,学习中请遵循国家相关法律法规。如有问题请联系我们,联系邮箱,我们会在最短的时间内进行处理。
上一篇:【】【】使用Nodejs+Yeoman定制前端开发项目构建工具 - 为程序员服务
使用Nodejs+Yeoman定制前端开发项目构建工具
Nodejs介绍
现在说起Nodejs大家肯定不陌生了,没吃过猪肉也见过猪跑,它的推广也是带着争议的,有些人或多或少会鄙视它,免不了被各种程序语言社区对比。在我开始用它之前,我也不知道它到底有什么好的。原归正传,官方的介绍如下:
Node.js is a platform built on Chrome’s JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.
这句话中的几个要点:1,它是基于chrome的javascript引擎编译出的平台;2,它使用事件驱动和无阻塞I/O模型;3,它是轻量高效的;4,适用于数据密集型的实时应用;5,它是跨平台的。
大概是这样,更多关于Nodejs的背景我就不再赘述,google之。有群友问我怎么学Nodejs,我的回答是,我也是最近一个月边学边开发了两个工具(重构内审规范自动化审查工具和前端开发项目初始化工具),从实际问题着手,寻找解决方案,没有系统的学,对它,我也是一知半解,它只是一个工具,实现这两个工具查官方API文档和google足够了。
说到前端开发项目构建不得不提鼎鼎大名的Yeoman,它定义了一个工作流,包含了三个核心工具(yo,bower和grunt)来帮你更快的构建和开发应用。这个项目自动构建的实现是Yeoman的核心脚手架工具yo帮我做了大部分工作,而我只是编写了要生成的目标项目框架模版。
开始讲如何实现工具之前,我们先来体验一下如何快速生成一个前端开发项目框架,该项目框架包含源码目录,单元测试,代码校验,文档工具,合并压缩,coffeescript编译等前端常用工具及相关配置。假设你已经完成Nodejs环境的安装配置并了解基本的命令行操作。
全局安装yo:
$ npm install -g yo
$ npm install -g yo
全局安装generator-fedp:
$ npm install -g generator-fedp
$ npm install -g generator-fedp
通过上面两条命令,你已经成功安装了yo和fedp这个项目生成器,接下来只要一条命令就可以完成前端开发项目的初始化构建,首先在命令行里切换到即将进行开发的项目目录,然后执行以下命令:
你会看到yo帮你创建之前说到的相关文件并且根据模版配置自动帮你下载所需的node模块以及这些模块的依赖模块,一阵刷屏之后,项目就构建完毕了,你只要把相关的配置(gruntfile.js,package.json或bower.json等)进行小调整就可以开始你的开发工作了。
生成目录框架如下,大概意思应该都能看明白,readme文件里也有说明
接下来介绍怎么实现这个过程,其实很简单,按照官方文档关于generator的介绍就可以完成一个generator的编写:,简单讲几个要点。
yo已经为你准备开发generator做了一个generator模版,好像有点绕,意会意会,只要你装有yo和generator-generator模块,你就可以完成一个generator雏形,正如我们的fedp一样。先装个generator-generator:
$ npm install -g yo generator-generator
$ npm install -g yo generator-generator
然后命令行切换到你要编写generator的目录下,执行如下命令:
$ yo generator
$ yo generator
执行命令后,会要你输入你在Github上的用户名和仓库名,用来生成默认的配置信息,这些配置信息可以在你即将开发的generator根目录的package.json中找到并修改,当然如果你要使用Travis测试框架,也可以修改.travis.yml文件,如果有要改名的话。要注意的是,yo的generator命名规则就是generator-yourname,yourname是自定义的名称,但一定是以generator加横杠开头。当然这一步不会去检测你是否真的在Github上有这个项目,但是为了保险起见,可以在Github上创建一个,以免后面要提交npm的时候跟别人冲突了。成功生成后的目录结构如下:
我们要实现的这个generator的逻辑和模板在app下,index.js处理如何生成目标文件和定制化的参数处理,template里存放目标文件的模版,我们现在创建了一个叫test2的generator,然后我贴出index.js并注释说明这个文件里主要代码的作用。
JavaScript
//引入依赖模块,不了解的先看看Nodejs基础吧
'use strict';
var util = require('util');
var path = require('path');
var yeoman = require('yeoman-generator');
var Test2Generator = module.exports = function Test2Generator(args, options, config) {
yeoman.generators.Base.apply(this, arguments);
this.on('end', function () {
this.installDependencies({ skipInstall: options['skip-install'] });//读取命令中是否有--skip-install,如果有则在项目构建完毕后不自动安装依赖模块,用法:yo test2 --skip-install
this.pkg = JSON.parse(this.readFileAsString(path.join(__dirname, '../package.json')));
util.inherits(Test2Generator, yeoman.generators.Base);
Test2Generator.prototype.askFor = function askFor() {
var cb = this.async();
// have Yeoman greet the user.
console.log(this.yeoman);
//定义在命令执行时的输出提问信息,该信息你爱怎么用怎么用,比如提问要生成的项目名是什么,然后可以自动写入配置中之类的操作
var prompts = [{
type: 'confirm',
name: 'someOption',
message: 'Would you like to enable this option?',
default: true
this.prompt(prompts, function (props) {
this.someOption = props.someO
cb();//执行async,开始真正的工作,假设你不需要用户输入信息,可以把prompt去掉,但一定要执行cb,不然程序就不会有任何操作
}.bind(this));
Test2Generator.prototype.app = function app() {
this.mkdir('app');//在目标文件夹创建app目录,这里的目标文件夹是指你要初始化的项目目录
this.mkdir('app/templates');//在目标文件夹app下创建templates目录
this.copy('_package.json', 'package.json');//将_package.json复制到目标文件夹下,并重命名为package.json
this.copy('_bower.json', 'bower.json');
Test2Generator.prototype.projectfiles = function projectfiles() {
this.copy('editorconfig', '.editorconfig');//操作与上面的一样,都会被执行,位置可以任意放
this.copy('jshintrc', '.jshintrc');
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
//引入依赖模块,不了解的先看看Nodejs基础吧'use strict';var util = require('util');var path = require('path');var yeoman = require('yeoman-generator');var Test2Generator = module.exports = function Test2Generator(args, options, config) {&&yeoman.generators.Base.apply(this, arguments);&&this.on('end', function () {&&&&this.installDependencies({ skipInstall: options['skip-install'] });//读取命令中是否有--skip-install,如果有则在项目构建完毕后不自动安装依赖模块,用法:yo test2 --skip-install&&});&&this.pkg = JSON.parse(this.readFileAsString(path.join(__dirname, '../package.json')));};util.inherits(Test2Generator, yeoman.generators.Base);Test2Generator.prototype.askFor = function askFor() {&&var cb = this.async();&&// have Yeoman greet the user.&&console.log(this.yeoman);//定义在命令执行时的输出提问信息,该信息你爱怎么用怎么用,比如提问要生成的项目名是什么,然后可以自动写入配置中之类的操作&&var prompts = [{&&&&type: 'confirm',&&&&name: 'someOption',&&&&message: 'Would you like to enable this option?',&&&&default: true&&}];&&this.prompt(prompts, function (props) {&&&&this.someOption = props.someO&&&&cb();//执行async,开始真正的工作,假设你不需要用户输入信息,可以把prompt去掉,但一定要执行cb,不然程序就不会有任何操作&&}.bind(this));};Test2Generator.prototype.app = function app() {&&this.mkdir('app');//在目标文件夹创建app目录,这里的目标文件夹是指你要初始化的项目目录&&this.mkdir('app/templates');//在目标文件夹app下创建templates目录&&this.copy('_package.json', 'package.json');//将_package.json复制到目标文件夹下,并重命名为package.json&&this.copy('_bower.json', 'bower.json');};Test2Generator.prototype.projectfiles = function projectfiles() {&&this.copy('editorconfig', '.editorconfig');//操作与上面的一样,都会被执行,位置可以任意放&&this.copy('jshintrc', '.jshintrc');};
整个代码就这样写完了,你要做的就只是在template下创建好目录结构,然后以后的项目都是template下的文件和目录副本,这样就实现了一个generator,是不是很简单?但是这里有一些潜在的问题,不管是Github还是generator他们都不会复制空目录,也就是说如果你要放空目录,里面必须放一个文件(可以是空文件),这样可以提交到Github也可以用this.directory直接将template下的目录整个复制到目标文件夹下,而不用一直mkdir,这样也就产生了许多垃圾文件,不用担心,你可以在gruntfile里配置clean任务,在项目构建完成后一键清除这些垃圾文件。
在你把项目提交到npm之前,要怎么调试呢?很简单,命令行切换到你的generator目录下执行下面的命令:
$ npm link
$ npm link
这样就会在node全局模块目录下建立该模块的快捷方式或软链接,之后就可以随时修改代码随时使用yo命令来测试你的generator了。
发布Nodejs模块
要发布你的generator到npm服务器上,你需要有社区帐号,你只需执行命令npm adduser,然后根据提示输入你的用户名密码等信息即可创建帐号,然后在你的generator目录下执行npm publish,没有异常的话又是一阵刷屏,然后就提示你发布成功,你可以到https://npmjs.org/上搜到你发布的模块了。发布后别人就可以跟使用其他node模块一样使用你的generator啦。
如果你熟悉完整个流程后会发现,这个generator的开发几乎没有什么难度,只要你有前端开发基础,最后丢个链接给大家围观参考一下,我的generator-fedp:,欢迎试用反馈改进建议。
一个不正经瞎折腾的前端开发工程师,SINCE 2009
原文地址:, 感谢原作者分享。
您可能感兴趣的代码}

我要回帖

更多关于 nodejs搭建http服务器 的文章

更多推荐

版权声明:文章内容来源于网络,版权归原作者所有,如有侵权请点击这里与我们联系,我们将及时删除。

点击添加站长微信