2017-03-25 97 views
0

我正在嘗試學習react + express。這是我所關注的文件夾結構。routes.js上的意外令牌導入

app 
-client 
    -components 
    -home.jsx 
-nodemodules 
-server 
-config.js   
-package.json 
-routes.js 

**的package.json:

{ 
    "name": "job-application", 
    "version": "1.0.0", 
    "description": "making a website using MERN ", 
    "main": "nodemon config.js", 
    "scripts": { 
     "start": "node config.js" 
    }, 
    "repository": { 
     "type": "git", 
     "url": "git+https://github.com/devarashetty/webApplication.git" 
    }, 
    "author": "sairam", 
    "license": "ISC", 
    "bugs": { 
     "url": "https://github.com/devarashetty/webApplication/issues" 
    }, 
    "devDependencies": { 
     "babel-core": "^6.0.14", 
     "babel-loader": "^6.0.0", 
     "webpack": "^1.12.2", 
     "webpack-dev-server": "^1.12.1" 
    }, 
    "dependencies": { 
     "express": "3.x", 
     "http": "*", 
     "react": "*", 
     "react-dom": "*", 
     "react-router": "*", 
     "react-router-dom": "*", 
     "react-router-config": "*", 
     "nodemon": "*", 
     "mongodb": "*", 
     "semantic-ui-react": "*" 
    }, 
    "homepage": "https://github.com/devarashetty/webApplication#readme" 
} 

Routes.js

import HomePage from './client/components/home'; 

我收到錯誤Unexpected token import。什麼是背後this.I思想進口是一個默認的原因功能在javascript中可用

config.js

var http = require("http"); 
var mongodb = require("mongodb"); 
var app = require('express')(); 
var server = require('http').Server(app); 
var routes = require("./routes.js"); 
var Router = require('react-router'); 

server.listen(8000); 

app.use(function(req, res, next) { 
    console.log("------------", req.url); 
    var router = Router.create({ 
     location: req.url, 
     routes: routes 
    }); 
    router.run(function(Handler, state) { 
     var html = React.renderToString(< Handler/>) 
     return res.render('react_page', { 
      html: html 
    }) 
    }) 
}); 

var MongoClient = mongodb.MongoClient; 
var url = 'mongodb://localhost:27017/catering'; 

MongoClient.connect(url, function(err, db) { 
    if (err) { 
     console.log('Unable to connect to the mongoDB server. Error:',  err); 
    } else { 
     console.log('Connection established to', url); 

     db.close(); 
    } 
}); 
+0

@BelminBedak我創建了一個文件的package.json,添加了必需的依賴關係,並做了'NPM install'.I雖然'babel'將採取'es6'代碼轉換爲'javascript'照顧所以我加太。但它仍然會發生。 –

+0

請郵編config.js的代碼 –

+0

@HariLamichhane我會發布它 –

回答

1

這是工作的解決方案,可能不是最好的解決辦法:)

首先在下面的package.json變化start關鍵。

"start": "node ./bin/www" 

現在創建了一個名爲www裏面的文件名爲bin文件夾[注:它不具備任何擴展]內www

#!/usr/bin/env node 
require("babel-register")({ 
    presets: ["es2015", "react"], 
}); 
var app = require('../app'); 
app.set('port', process.env.PORT || 3000); 
app.listen(app.get('port')); 

認沽下面的代碼,重新命名config.jsapp.js並在文件末尾添加module.exports = app

請確保您有這些依賴於你的package.json [版本可以更新]

"babel-cli": "^6.18.0", 
"babel-core": "^6.18.2", 
"babel-loader": "^6.2.8", 
"babel-preset-es2015": "^6.9.0", 
"babel-preset-react": "^6.11.1", 

現在,您可以在其他文件中使用import除了上面所使用的文件。