mongoDB，express，webpack-dev-middleware，console.log數據庫集合將不起作用

我嘗試將mongoDB，express和webpack-dev-middleware一起設置。我想盡可能使用最簡單的方式，儘可能少地添加模塊。我基於幾個教程（我沒有找到一個簡單的）。當我從mongoDB收集控制檯日誌時，一切都奏效了。我的安慰中沒有任何印刷品。mongoDB，express，webpack-dev-middleware，console.log數據庫集合將不起作用

我敢肯定，連接到mongoDB是好的。我認爲這是webpac-dev-middleware和路由的問題，但我找不到一些有用的信息或教程。

server.js

const path = require('path'); 
const express = require('express'); 
const webpack = require('webpack'); 
const bodyParser = require('body-parser'); 
const config = require('./webpack.config.js'); 

const app = express(); 

const compiler = webpack(config); 

app.use(bodyParser.urlencoded({extended: true})); 

const MongoClient = require('mongodb').MongoClient; 

var db; 

MongoClient.connect('mongodb://USER:[email protected]:PORT/testit' (err, database) => { 
    if (err) return console.log('Connection error: ',err); 
    db = database; 
    app.listen(3000,() => { 
    console.log('MongoDB listening on 3000'); 
}); 
}); 

const webpackDevMiddleware = require('webpack-dev-middleware')(compiler, { 
    noInfo: true, 
     stats: { 
     colors: true, 
     } 
    }); 
const webpackHotMiddleware = require('webpack-hot-middleware')(compiler, { 
    log: console.log 
}); 

app.use(webpackDevMiddleware); 
app.use(webpackHotMiddleware); 

app.use(express.static(__dirname + '/')); 
app.get('/', (req, res) =>{ 
    db.collection('quotes').find().toArray(function(err, results) { 
     console.log(results); //according to tutorial this line should to display console log, but I have nothing, even if I try console log error. Or whatever... 
    }); 
}); 

app.post('/quotes', (req, res) => { 
    console.log(req.body); 
    db.collection('quotes').save(req.body, (err, result) => { 
    if (err) return console.log(err); 

    console.log('saved to database'); 
    res.redirect('/'); 
    }); 
}); 

var listener = app.listen(8888, function(){ 
    console.log('Listening on port ' + listener.address().port + ' mode: ' + 
app.settings.env); 
});

webpack.confing.js

'use strict'; 

var Webpack = require('webpack'); 
var path = require('path'); 

var config = { 
    entry: [ 
     'webpack-hot-middleware/client', 
     './public/index.js' 
    ], 
    output: { 
     path: __dirname + "/dist", 
     filename: "bundle.js" 
     }, 
    devServer: { 
     headers: { 
      "Access-Control-Allow-Origin": "*", 
      "Access-Control-Allow-Credentials": "true", 
      "Access-Control-Allow-Headers": "Content-Type, Authorization, x-id, Content-Length, X-Requested-With", 
      "Access-Control-Allow-Methods": "GET, POST, PUT, DELETE, OPTIONS" 
     }, 
     inline: true 
    }, 
    module: { 
     loaders: [ 
      { 
       test: /\.js$/, 
       loader: 'babel-loader', 
       exclude: /node_modules/, 
       query: { 
        presets: ['es2015','react'] 
       } 
      } 
     ] 
    }, 
    plugins: [new Webpack.HotModuleReplacementPlugin()] 
}; 

module.exports = config;

請幫我看看哪兒問題。我確信我誤解了某些東西，但我不知道是什麼。

來源

2017-06-04 Eva

你不應該在你的問題中發佈實際的工作證書。我已將它們編輯出來，但請更改密碼。關於你的問題：你的項目的根目錄中是否有一個名爲'index.html'的文件？ – robertklep

非常感謝。通常我會記住有關用戶和密碼的問題。是的，index.html在根目錄 – Eva

問題是express.static會找到index.html文件並提供它，因此/的請求將永遠不會到達您的路由處理程序。

如果你想讓它被調用，您需要express.static之前聲明它：

app.get('/', (req, res) =>{ 
    db.collection('quotes').find().toArray(function(err, results) { 
     console.log(results); 
     res.sendFile(__dirname + '/index.html'); // respond with the `index.html` file 
    }); 
}); 
app.use(express.static(__dirname + '/'));

來源

2017-06-04 19:45:40 robertklep

是的，它的工作:-)。非常感謝你。 – Eva

沒錯，如果有人想使用它，這部分代碼應該是這樣的：

app.get('/', (req, res, next) =>{ 
    db.collection('quotes').find().toArray(function(err, results) { 
     console.log(results); 
    }); 
    next(); 
}); 

app.use(express.static(__dirname + '/'));

Add next。

來源

2017-06-05 08:16:25 Eva

mongoDB，express，webpack-dev-middleware，console.log數據庫集合將不起作用

回答

相關問題