GET错误MEAN App

Mic*_*lec 14 nginx node.js angularjs mean-stack

我一直在学习如何使用MEAN堆栈来构建Web应用程序,到目前为止它已经很有趣了.我没有使用yeoman生成器或npm应用程序为我生成代码,而是从头开始构建我的整个应用程序.通过这种方式,我知道每个部分如何连接以及我的应用程序发生了什么.当我查看开发人员控制台并看到时,我刚开始连接应用程序的前端和后端

GET http://blog.dev/bower_components/angular/angular.js
Run Code Online (Sandbox Code Playgroud)

不仅有角度,还有我拥有的其他资源(Modernizr,angular-routes,mootools,restangular等等).使用yeoman角度生成器时,您可以运行grunt serve命令启动角度侧.因为我从头开始构建应用程序,我使用npm作为构建工具,我不知道如何构建前端服务器.所以,我只是使用一个指向我的index.html的简单nginx虚拟主机.这是配置:

server {
        listen 80;

        server_name blog.dev;

        root /home/michael/Workspace/blog/app;
        index index.html index.htm;

        location / {
                try_files $uri $uri/ =404;
        }
}
Run Code Online (Sandbox Code Playgroud)

我不确定其他变量可能会对这种情况产生什么影响,所以如果我错过了什么,请告诉我,我很乐意为您提供所需的信息!

ast*_*eet 5

如果您使用的是平均堆栈,则应该能够同时承载后端并直接为节点提供前端服务.

我不确定你的项目结构,但这是我现在正在研究的结构.

/bin --contains a file called www.js (used to launch app)
/data
/models
/node_modules
/public -- contains my angular implementation
/routes -- contains express routes
/temp
/upload
/views
app.js -- main configuration for express
api.js -- my apis
package.json
Run Code Online (Sandbox Code Playgroud)

在/bin/www.js文件中,您有代码来启动节点服务器.

var app = require('../app');

app.set('port', process.env.PORT || 3000);

var server = app.listen(app.get('port'), function() {
debug('Express server listening on port ' + server.address().port);
});        
Run Code Online (Sandbox Code Playgroud)

您还需要设置express和您的路由,以便在routes目录中首先查看路由我有一个名为index.js的文件

在这个文件中,我定义了一条通向我的angular index.html页面的路线.

var express = require('express');
var router = express.Router();

/* GET home page. */
router.get('/', function(req, res) {
res.redirect('/pages/index.html');
});

module.exports = router;
Run Code Online (Sandbox Code Playgroud)

当然,你需要设置快递.

process.env.TMPDIR = 'tmp'; // to avoid the EXDEV rename error, see            http://stackoverflow.com/q/21071303/76173

var express = require('express');
var path = require('path');
var favicon = require('static-favicon');
var logger = require('morgan');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var multer = require('multer');
var flow = require('./flow-node.js')('tmp');
var multipart = require('connect-multiparty');
var multipartMiddleware = multipart();
var uuid = require('uuid');
var mongoose = require('mongoose');
var session = require('express-session');

var routes = require('./routes/index');

var app = express();

app.use(favicon());
app.use(logger('dev'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded());
app.use(cookieParser());
app.use(session({genid: function(req) { return uuid.v4()}, secret:   'XXXXXXXXXXX',
    saveUninitialized: true,
    resave: true}));
app.use(express.static(path.join(__dirname, 'public')));

app.use('/', routes);
app.use('/users', users);

module.exports = app;
Run Code Online (Sandbox Code Playgroud)

现在假设你在某个地方的'public'目录中有你的Angular文件和javascript,你应该能够使用以下命令启动Node.

node bin/www
Run Code Online (Sandbox Code Playgroud)

并将您的浏览器指向http:// localhost:3000并开展业务.

希望这有助于快乐学习.