错误:ENOENT:没有这样的文件或目录与Angular2和Express.js

我正在对GitHub上的这个示例Angular2应用程序进行小的修改,以便它使用Express.js而不是KOA。 但目前,当我尝试在FireFox中加载应用程序时, nodemon控制台中会显示以下错误:

 Error: ENOENT: no such file or directory 

localhost : 8080的http请求触发*路由器处理程序时,Angular2应用程序开始加载,该处理程序返回index.html ,然后触发一系列嵌套依赖项的callback,其中一个引发错误并暂停应用程序加载mid-通过方式。

需要对GitHub示例中的代码进行哪些特定的更改才能解决Error: ENOENT: no such file or directory


背景和代码:


这里是使用Express.js代替KOA的router.js的新替代品:

 'use strict'; let uuid = require('node-uuid'); var path = require('path'); let jwt = require('jsonwebtoken'); let config = require('./config'); // expose the routes to our app with module.exports module.exports = function(app) { //all other methods omitted here for brevity app.get('*', function(req, res) { console.log('inside * route!'); if(req.url === '/'){ res.sendFile(path.resolve('dist/client/index.html')); // load the single view file (angular will handle the front-end) } else { res.sendFile(path.resolve('./dist/client' + req.url)); } }); }; 

nodemon控制台输出的请求到localhost : 8080 ,触发上面的Express.js app.get('*'...)方法反复导致错误是:

 App listening on port 8080 inside * route! GET / 304 54.261 ms - - inside * route! inside * route! inside * route! GET /boot.css 304 4.637 ms - - GET /boot.js 304 4.447 ms - - GET /vendor.js 304 3.742 ms - - inside * route! GET /vendor.js.map 200 3.180 ms - 3115631 inside * route! GET /boot.js.map 200 2.366 ms - 61810 inside * route! GET /bootstrap.css.map 404 2.515 ms - 169 Error: ENOENT: no such file or directory, stat '/home/user/nodejs_apps/angular2_oauth_seed_app/dist/client/bootstrap.css.map' at Error (native) 

而指定Express.js的新的server/index.js是:

 // set up ====================================================================== var express = require('express'); var app = express(); // create our app w/ express var port = process.env.PORT || 8080; // set the port var morgan = require('morgan'); // log requests to the console (express4) var bodyParser = require('body-parser'); // pull information from HTML POST (express4) var methodOverride = require('method-override'); // simulate DELETE and PUT (express4) app.use('/static', express.static(__dirname + '/dist/client')); app.use(morgan('dev')); // log every request to the console app.use(bodyParser.urlencoded({'extended':'true'})); // parse application/x-www-form-urlencoded app.use(bodyParser.json()); // parse application/json app.use(bodyParser.json({ type: 'application/vnd.api+json' })); // parse application/vnd.api+json as json app.use(methodOverride()); app.use('/scripts', express.static(__dirname + '/node_modules/')); // load the routes require('./router')(app); // listen (start app with node server.js) ====================================== app.listen(port); console.log("App listening on port " + port); 

GitHub示例应用程序中的所有其他内容与GitHub上的相同,package.json除外,其中仅包含依赖项,以支持上述router.jsindex.js的更改。

bootstrap.css.map表示您的浏览器正在尝试为Bootstrap CSS加载源映射(这是一个debugging工具)。

这只会发生,如果你有你的浏览器的开发工具打开,所以不是严格的问题(除非你想实际debuggingBootstrap的CSS)。 除此之外,总是可以请求其他URL,并产生相同的错误。

一个解决scheme是向sendFile添加一个显式的error handling程序,并假设发生错误时,这是​​因为该文件不存在(所以它应该产生一个404响应):

 res.sendFile(path.resolve('./dist/client' + req.url), (err) => { if (err) return res.sendStatus(404); });