基本环境搭建
作者是在Ubuntu的环境下开始学习YUI的,YUI3一般和NodeJs等环境整合在一起,开发时对网络的依赖较强烈。所以建议在网络环境良好,并可配置本地代理的机器上学习开发,避免因为依赖包下载不下来而降低学习兴趣。
1.1 NodeJs环境搭建
Ubuntu :sudo apt-get install nodejs
1.2 npm环境搭建
Ubuntu: sudo apt-get install npm
1.3 express环境搭建
express为NodeJs的一套web框架,整合了url router/err handle/basic utils等一些列功能
>> npm install-g express
1.3.1 express-generator安装
express-generator为express项目骨架生成器,可以帮助生成一个基本的项目骨架和初始化一些骨架代码,极大的加快web开发进程。
>> npm install -g express-generator
1.4 初始配置 npm package
>> npm init
会有一个配置向导,提示当前工程使用的名称/版本号/git仓库地址等,依赖关系元数据需要单独配置,
这个操作过程类似于maven生成项目骨架和生成一个初始pom文件一样,也会生成一个package.json的配置文件。
笔者提供一个demo 配置文件,包括接下来要使用的yui3,expres框架和grunt构建工具
{ "name": "yui3_tutorial", "version": "0.0.1", "private": true, "scripts": { "start": "node ./bin/www" }, "dependencies": { "express": "~4.2.0", "static-favicon": "~1.0.0", "morgan": "~1.0.0", "cookie-parser": "~1.0.1", "body-parser": "~1.0.0", "debug": "~0.7.4", "jade": "~1.3.0" } }
1.5 生成初始项目骨架
使用express-generator工具生成项目骨架,包括views/bin/public等目录
xiangkui@xiangkui-pc:~/workspace/my_workspace$ express --css . destination is not empty, continue? destination is not empty, continue? (yes or no) destination is not empty, continue? (yes or no) yes
create : . create : ./package.json create : ./app.js create : ./public create : ./routes create : ./routes/index.js create : ./routes/users.js create : ./views create : ./views/index.jade create : ./views/layout.jade create : ./views/error.jade create : ./bin create : ./bin/www create : ./public/stylesheets create : ./public/stylesheets/style.css create : ./public/javascripts create : ./public/images
install dependencies: $ cd . && npm install
run the app: $ DEBUG=my_workspace ./bin/www |
1.6启动demo项目
>> cd bin && node www
程序在本机监听3000端口,并且启动一个web应用
访问 http://localhost:3000端口,即可以访问该应用
参考链接:
http://nodejs.org/
http://expressjs.com/guide.html