好吧,这个问题可能与 Angular 2 无关,但是......在观看了 Deborah 的 PluralSight 入门视频后,我尝试将我现有的 angular 1.x 项目迁移到 angular 2。对于客户端部分,我想切换到TypeScript 和 Angular 2,但对于服务器部分,我想尽可能地保留现有代码。我遇到的第一个问题是如何用我自己的 server.js 替换 Deborah 项目中使用的 lite-server,同时保持她的浏览器同步设置。这是她的 package.json 文件的一部分,它使用带有 -c 参数的 lite-server:
"scripts": {
"build": "tsc -p src/",
"build:watch": "tsc -p src/ -w",
"serve": "lite-server -c=bs-config.json",
"prestart": "npm run build",
"start": "concurrently \"npm run build:watch\" \"npm run serve\"",
"lint": "tslint ./src/**/*.ts -t verbose"
},
bs-config.json 看起来像这样:
{
"server": {
"baseDir": "src",
"routes": {
"/node_modules": "node_modules"
}
}
}
我的问题是如何用我的 server.js 替换 lite-server,如下所示:
var express = require('express');
var app = express();
var morgan = require('morgan');
var bodyParser = require('body-parser');
var http = require('http');
var path = require('path');
var session = require('express-session');
var route = require('./server/route');
app.use(express.static(__dirname + '/public'));
app.use(bodyParser.json({ type: 'application/vnd.api+json' }));
var port = 3000;
app.listen(port);
console.log('App listening on port ' + port);
route.init(app);
app.get('*', function(req, res) {
res.sendfile(__dirname + '/public/index.html');
});
systemjs.config.js
/**
* System configuration for Angular 2 samples
* Adjust as necessary for your application needs.
*/
(function (global) {
System.config({
paths: {
// paths serve as alias
'npm:': 'node_modules/'
},
// map tells the System loader where to look for things
map: {
// our app is within the app folder
app: 'app',
// angular bundles
'@angular/core': 'npm:@angular/core/bundles/core.umd.js',
'@angular/common': 'npm:@angular/common/bundles/common.umd.js',
'@angular/compiler': 'npm:@angular/compiler/bundles/compiler.umd.js',
'@angular/platform-browser': 'npm:@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/http': 'npm:@angular/http/bundles/http.umd.js',
'@angular/router': 'npm:@angular/router/bundles/router.umd.js',
'@angular/forms': 'npm:@angular/forms/bundles/forms.umd.js',
// other libraries
'rxjs': 'npm:rxjs'
},
// packages tells the System loader how to load when no filename and/or no extension
packages: {
app: {
main: './main.js',
defaultExtension: 'js'
},
rxjs: {
defaultExtension: 'js'
}
}
});
})(this);
tsconfig.json
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"moduleResolution": "node",
"sourceMap": true,
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"lib": [ "es2015", "dom" ],
"noImplicitAny": true,
"suppressImplicitAnyIndexErrors": true
}
}