Angular 2 cli与Express js
我想使用快速js w / node js作为我的angular度2项目的服务器。 我正在看教程集成快速js w /angularcli（我跟着这个和这个 ），我没有运气。 有没有人有任何build议如何做到这一点？ 目前，我有一个新的项目了w / cli只是说“应用程序的作品！ 并希望尝试使用快速而不是使用精简版服务器。
任何帮助表示赞赏！
这个链接适用于我，但有一些变化。
我安装angular-cli并创build新的项目，然后我按照链接的教程，但与此更改：
- 我创build了一个名为node_server的文件夹
- 在运行npm install express – 保存在我的项目的根文件夹中。 在package.json中添加像dependencie这样的服务器，而无需在node_server上创build新的服务器。
- 我使用基本的express服务器在node_server中创build了一个名为server.js的新文件。 该服务器只返回dist文件夹的index.html。
- 将脚本添加到package.json中，脚本在链接教程中是相同的，但是只有一个更改，文件名是server.js而不是index.js
这是我的server.js文件：
const express = require('express'); var app = express(); var staticRoot = __dirname; app.set('port', (process.env.PORT || 3000)); app.use(express.static(staticRoot)); app.get('/', function(req, res) { res.sendFile('index.html'); }); app.listen(app.get('port'), function() { console.log('app running on port', app.get('port')); });
上面的评论对我来说工作得非常好，只需要对该链接中build议的package.json中的脚本进行一些调整即可。
“build：nodeserver”：“ng build && cp node-server / * dist”，
“build：nodeserver-prod”：“ng build -prod && cp node-server / * dist”，
“serve-build”：“npm run build：nodeserver && nodemon dist / index.js”，
“serve-build-prod”：“npm run build：nodeserver-prod && nodemon dist / index.js”
我有一个名为node-server的文件夹，上面有我的server.js文件，上面有angular2应用程序的路由，还有一些api路由，还有一些其他文件夹在节点服务器上，比如mysql-requests和一些像config.json文件
我为Angular 2/4（使用CLI）和Express服务器创build了一个简单的初学者应用程序。 也许有人会觉得它有用：
https://github.com/commercialsuicide/angular2-with-express-starter
我所做的创build2个文件夹是您的快递服务器（我正在使用Express-Generator）和1个Angular 2项目（Angular cli）
根文件夹
—>服务器
—> NG4
—> gulpfile.js
gulp将build立你的应用程序并移动构build文件
var gulp = require('gulp') var rename = require("gulp-rename"); var deletefile = require('gulp-delete-file'); var exec = require('child_process').exec; var runSequence = require('run-sequence'); gulp.task('build', function (cb) { exec('cd ng4/ && ng build', function (err, stdout, stderr) { cb(err); }); }) gulp.task('rename', () => { return gulp.src("./ng4/dist/index.html") .pipe(rename("ng4.html")) .pipe(gulp.dest("./server/views")); }) gulp.task('deletefile', function () { var regexp = /\w*(\-\w{8}\.js){1}$|\w*(\-\w{8}\.html){1}$/; gulp.src(['./server/public/index.html', './ng4/dist/**/*.*']) .pipe(deletefile({reg: regexp,deleteMatch: false})); }); gulp.task('move', function () { return gulp.src(["./ng4/dist/**/*.*"]) .pipe(gulp.dest("./server/public")); }); gulp.task('default', function(callback) { runSequence('build','rename','move','deletefile',callback) });
通过这种方式，你可以在ng4应用程序中开发并在root上运行gulp命令。