如何正确设置节点，快速和角度2

How to setup Node, Express and Angular2 properly

本文关键字：何正确 设置 节点      更新时间：2023-09-26

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

但我不确定如何正确设置它的组合。到目前为止，我的文件结构如下所示，我打算将前端放在公用文件夹下。

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

到目前为止，我的服务器.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;

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

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

下载 
{
  "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"
  }
}

现在我的问题是我如何添加 Angular2 以在公共场合正常工作，因此它们在 npm start 一起启动。我一直在关注 Angulars 文档站点的快速入门，并注意到他们使用精简服务器，但这不应该是 node/express 所必需的，对吗？添加 Angular2 后，我的 package.json 应该是什么样子。例如像这样：

├── package.json
├── public
│   ├── app
│   │   ├── app.component.js
│   │   └── main.js
│   └── index.html
├── routes
│   └── test.js
├── server.js
└── views
如果现在使用 Angular2

还为时过早，那么我有同样的问题，但对于 Angular1.X，或者将 Angular2 与 TS 一起使用更好？

我对相同的设置感到好奇，并且能够编写一个简单的，使用 NG2 RC1 的示例，介绍如何在 Express 上运行 NG2。 与NG1相比，设置并不简单，NG2 on Express 的关键是确保 SystemJS 知道在哪里可以找到库

以下是您应该研究的关键事项。请注意，不建议暴露node_modules。我希望我的示例简单，以便可以轻松地将重点放在学习基本设置上。

  1. 公开静态资源（索引.html）和依赖项（node_modules）的位置
app.use(express.static(rootPath + '/client/app'))
app.use('/node_modules', express.static(rootPath + '/node_modules'));
  1. 让 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));

请在 GitHub 上查看我的示例

您可以使用生成器来创建基本目录和文件以开始使用以后任何数据库都可以通过从 npm 安装其插件来使用。

相关文章：