24

我仍然想尝试使用 Yeoman 和 Express 运行示例。

我尝试了以下方法，它“正常”工作，但我被困在合并路线上。（为了可读性而过度简化）

mkdir test
cd test
express
mkdir app
cd app
mkdir js
cd js
yeoman angular

然后我在 Gruntfile.js 中将“output:dist”更改为“output:../../public”

现在，两个服务器都可以自己运行（例如 yeoman 服务器和节点 app.js）。我现在也可以运行“yeoman build”，将缩小的 JS 输出到 express 应用程序中的 /public。

我对路线如何合并有点模糊？我想/拉起 Angular 路线而不是 express 路线等。github 上的 angular-express-seed 示例看起来不错，但我仍然希望 Yeoman 集成到项目中。

任何建议，将不胜感激。

4

6 回答 6

23

我会为 yeoman + expressjs 推荐这种结构：

mkdir app
cd app
yeoman angular
express .

所以你的目录树应该是这样的：

.
├── app
│   ├── 404.html
│   ├── favicon.ico
│   ├── index.html
│   ├── robots.txt
│   ├── scripts
│   │   ├── controllers
│   │   │   └── main.js
│   │   ├── vendor
│   │   │   ├── angular.js
│   │   │   ├── angular.min.js
│   │   │   ├── es5-shim.min.js
│   │   │   └── json3.min.js
│   │   └── yeoman-test.js
│   ├── styles
│   │   └── main.css
│   └── views
│       └── main.html
├── app.js
├── Gruntfile.js
├── package.json
├── public
│   ├── images
│   ├── javascripts
│   └── stylesheets
│       └── style.css
├── routes
│   ├── index.js
│   └── user.js
├── test
│   ├── lib
│   │   └── angular-mocks.js
│   └── spec
│       └── controllers
│           └── main.js
├── testacular.conf.js
└── views
    ├── index.jade
    └── layout.jade

您可以删除现在冗余的public目录（我们将改为从中提供服务app）：

rm -rf public

现在app.js，您需要更改从哪个目录提供静态文件。更改此行：

app.use(express.static(path.join(__dirname, 'public')));

对此：

app.use(express.static(path.join(__dirname, 'app')));

这应该是关于它的。需要注意的是，您现在有两个“索引”文件——一个在 中views/index.jade，另一个在app/index.html. 删除app/index.html当前中断的 yeoman，所以我的建议是摆脱路线app/index.jade并仅对index.html.

希望这可以帮助！

于 2013-01-01T16:31:16.047 回答
8

这是另一个略有不同的设置

yo angular

更新 Gruntfile.js 以将配置从“app”更改为“public”。

然后做

express .

打开 app.js 并确保没有像这样的路由映射 app.get('/', routes.index); 这样节点服务器实际上会提供 index.html，与运行“grunt server”时加载的文件相同。

现在继续删除公共目录，然后将应用程序目录移动到公共

rm -rf public
mv app public
于 2013-04-25T14:06:57.090 回答
2

这个项目似乎涵盖了所有要求（甚至对 MongoDB 有可选支持）：https ://github.com/DaftMonk/generator-angular-fullstack

我刚刚在本地尝试过，它可以工作：

npm install -g generator-angular-fullstack

yo angular-fullstack [appname]

有关更多信息，请参阅 GitHub 页面。

于 2013-11-20T14:00:52.017 回答
1

如果我有名声，我会评论@btford 的答案 -

只是想添加，express .之后安装yo angular将覆盖 grunt-created package.json 文件，这将破坏 grunt，正如@jjperezaguinaga 报告的那样。

确保在安装前保存 package.json 的副本express .。然后在原来的 package.json 中添加如下依赖：

"dependencies" : { 
  "express": "3.3.4",
  "jade": "*"
}
于 2013-09-12T22:32:32.847 回答
0

我在使用这个解决方案时遇到了问题：express 仍然尝试加载 index.jade 而不是 index.html，但是如果我输入 localhost:3000/index.html express 渲染正确。我解决了从 app.js 中删除这一行的问题：

//app.get('/', routes.index);

希望这可以帮助。谢谢分享，D。

于 2013-05-28T07:07:06.867 回答
0

这是其他人之前建议的步骤的汇编，但都是在一个编号的步骤中。这是基于版本：Yeoman 1.0.4 和 Express 3.3.8。

1）创建您的项目目录并 cd 进入它

2）安装角度：

yo angular

（如果您没有以 su 身份登录，则需要运行接下来的两行）

bower install
sudo npm install

3) 将 package.json 重命名为 package_yo.json （这样它就不会被 express 版本的 package.json 覆盖）

4) 安装 Express express -c less -Hs 。（或您想要的任何其他快递选项）

sudo npm install

5) 删除 Express' 公共目录 & 将 Express' app.js 中路径的 'public' 更改为 'app': app.use(require('less-middleware')({ src: _ dirname + '/app' }) ); app.use(express.static(path.join( _dirname, 'app')));

6) 删除 express 的默认路由（ app.get('/', routes.index); ）（现在 express 将使用 angular 的 /app 文件夹中指定的路由

7) 启动服务器 npm start

（然后你应该看到 Yeoman 的欢迎页面：localhost:3000/）

于 2013-09-20T02:28:00.417 回答