module.export内のルートを別のファイルに保存しながら、html、css、およびjsをすべて提供するにはどうすればよいですか？現在はhtmlのみが提供されています

Question

私は急行を使用するための初心者です。その結果、このWebアプリケーションを作ることで自分の道を邪魔しています。

module.export内のroute.jsという別のファイルに自分のルートがあり、このすべてをapp.js内で管理し、HTMLページを提供してモジュールに保持したいと考えています。私はsendFileを使ってこのようにしましたが、それはCSSとJSにも役立たないのです。これを修正するにはどうすればよいですか？

app.js

//setup 
var express = require('express'); 
var path = require('path'); 
var favicon = require('serve-favicon'); 
var logger = require('morgan'); 
var cookieParser = require('cookie-parser'); 
var bodyParser = require('body-parser'); 

var index = require('./routes/index'); 
var users = require('./routes/users'); 

var app = express(); 
var port = process.env.PORT || 3000; 
var mongoose = require('mongoose'); 
var flash = require('connect-flash'); 
var passport = require('passport'); 
var session = require('express-session'); 
var path = require('path'); 

//db 
var configDB = require('./config/database.js'); 
mongoose.connect(configDB.url); 
require('./config/passport')(passport); 

// view engine setup 
//app.set('views', path.join(__dirname, 'views')); 
//app.set('view engine', 'jade'); 
app.set('view engine', 'ejs'); 



//routes 
//app.use('/', index); 
//app.use('/users', users); 


// uncomment after placing your favicon in /public 
//app.use(favicon(path.join(__dirname, 'public', 'favicon.ico'))); 
app.use(logger('dev')); 
app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: false })); 
app.use(cookieParser()); 
app.use(express.static(path.join(__dirname, 'public'))); 



//passport 
app.use(session({secret: 'secret'})); 
app.use(passport.initialize()); 
app.use(passport.session()); 
app.use(flash()); 

//routes 
require('./app/routes.js')(app, passport); 


// catch 404 and forward to error handler 
/*app.use(function(req, res, next) { 
    var err = new Error('Not Found'); 
    err.status = 404; 
    next(err); 
});*/ 

// error handler 
/*app.use(function(err, req, res, next) { 
    // set locals, only providing error in development 
    res.locals.message = err.message; 
    res.locals.error = req.app.get('env') === 'development' ? err : {}; 

    // render the error page 
    res.status(err.status || 500); 
    res.render('error'); 
});*/ 

module.exports = app; 

//launch 
app.listen(port); 
console.log('Website starting on port ' + port); 

routes.js

module.exports = function(app,passport) { 
... 
    //--timesheet section--- 
    app.get('/timesheet', function(req, res) { 
     var path = require('path'); 
     res.sendFile(path.resolve('public/timesheet.html')); 
    }); 
... 
} 

Answer 1

あなたがview engineとstaticディレクトリを使用します。あなたはすでにいくつかのコードを持っています。

.ejsを使用して

あなたのビューエンジン：

app.set('views', path.join(__dirname, 'views')); 
app.set('view engine', 'ejs'); 

そして、あなたはあなたの静的に定義し、パス接頭辞を指定することができます：あなたのviewsディレクトリで

app.use('/assets', express.static(path.join(__dirname, 'public'))); 

を、.ejs拡張子を持つあなたのHTMLSを置く、などtimesheet.ejs。その後、あなたのcss/js/imageファイル用にassetsディレクトリを作成し、timesheet.ejsに/assets/style.cssを使用してそれらを参照することができます。

最後に、あなたのルートには、テンプレートをレンダリングしたいと思う：

res.render('timesheet')