Question

我正在尝试使用Node，Express，Angular2（数据库， - MongoDB或SQL）设置工作区

但我不确定如何正确设置它。到目前为止，我的文件结构看起来像这样，我打算将前端放在公共文件夹下。

── package.json
├── public
├── routes
│   └── test.js
├── server.js
└── views

到目前为止，我的 server.js 看起来像这样

var express = require('express');
var mysql = require('mysql');
var cookieParser = require('cookie-parser');
var bodyParser = require('body-parser');
var path = require('path');

var lel = require('./routes/test');

var app = express();

app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: false}));
app.use(cookieParser());
app.use(express.static(path.join(__dirname, 'public')));

app.use('/api/', test);

app.use(function(req, res, next) {
    // error handling
});


var server = app.listen(3000, function() {
    // shows the connection etc
});

module.exports = app;

我的 test.js 是我在/ api / test下处理API调用的地方。

这就是我的 package.json 的样子，带有npm的脚本，它将使用npm start和所有必需的依赖项启动服务器，可以使用{下载{1}}

npm install

现在我的问题是如何添加Angular2以便在公共场合正常工作，因此他们在{ "name": "testing", "version": "0.1.0", "description": "-", "main": "server.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "start": "node server.js" }, "author": "-", "license": "-", "dependencies": { "body-parser": "^1.15.0", "cookie-parser": "^1.4.1", "ejs": "^2.4.1", "express": "^4.13.4", "morgan": "^1.7.0", "mysql": "^2.10.2", "path": "^0.12.7" } }一起启动。我一直关注Angulars文档站点上的快速入门，并注意到他们使用的是lite-server，但是对于node / express来说这不是必需的吗？在添加Angular2之后，我的 package.json 应该如何？例如：

npm start

如果Angular2还为时尚早，那么我有相同的问题但是使用Angular1.X，或者将Angular2与TS一起使用会更好吗？

Answer 1

我对同样的设置很好奇，并且能够编写一个简单的，使用NG2 RC1 example来了解如何在Express上运行NG2。与NG1相比，安装程序并不简单，Express上NG2的关键是确保SystemJS知道在哪里找到库

以下是您应该关注的关键事项。请注意，建议不要公开node_modules。我希望我的例子很简单，因此可以轻松地将重点放在学习基本设置上。

公开静态资源（index.html）和依赖项（node_modules）的位置

app.use(express.static(rootPath + '/client/app'))
app.use('/node_modules', express.static(rootPath + '/node_modules'));

让SystemJS知道在哪里找到依赖项

System.config({
    map: {
        "@angular": "node_modules/@angular",
        "rxjs": "node_modules/rxjs"
    },
    packages: {
        '/': {
            //format: 'register',
            defaultExtension: 'js'
        },
        'node_modules/@angular/http': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'http.js'
        },
        'node_modules/@angular/core': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'index.js'
        },
        'node_modules/@angular/router': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'index.js'
        },
        'node_modules/@angular/router-deprecated': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'index.js'
        },
        'node_modules/@angular/platform-browser-dynamic': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'index.js'
        },
        'node_modules/@angular/platform-browser': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'index.js'
        },
        'node_modules/@angular/compiler': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'compiler.js'
        },
        'node_modules/@angular/common': {
            //format: 'cjs',
            defaultExtension: 'js',
            main: 'index.js'
        },
        'rxjs' : {
            defaultExtension: 'js'
        }
    }
});
System.import('./main').then(null, console.error.bind(console));

Please have a look at my example on GitHub

Answer 2

您可以使用a generator which will create the basic directories and files to get started 稍后可以通过从npm安装其插件来使用任何数据库。

如何正确设置Node，Express和Angular2

2 个答案: