index.html不从babel加载传输的javascript_Javascript_Node.js_Express_Ecmascript 6_Babeljs

index.html不从babel加载传输的javascript

javascript node.js express ecmascript-6

index.html不从babel加载传输的javascript,javascript,node.js,express,ecmascript-6,babeljs,Javascript,Node.js,Express,Ecmascript 6,Babeljs,我正在尝试创建一个纯ES6应用程序，用于学习目的，使用node/express作为web服务器。我使用的是模块导入，正如您在server.js文件中看到的那样，它工作正常，但是当我在index.html中使用这些脚本时，他没有得到传输文件并调用“Uncaught SyntaxError:”我的问题是，我如何从index.html访问传输文件 server.js文件： import express from 'express' const port = 3000 const app = expr

我正在尝试创建一个纯ES6应用程序，用于学习目的，使用node/express作为web服务器。我使用的是模块导入，正如您在server.js文件中看到的那样，它工作正常，但是当我在index.html中使用这些脚本时，他没有得到传输文件并调用“Uncaught SyntaxError:”我的问题是，我如何从index.html访问传输文件

server.js文件：

import express from 'express'

const port = 3000
const app = express()

app.set("view options", {layout: false});

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

app.get('/', function(req, res) {
    res.render('index.html');
});

app.listen(port,()=>{
    console.log("server running in port "+ port)
})

import { MemberView } from 'MemberView'

export class MemberController{

    constructor(){

    }
}

package.json文件：

{
  "name": "ntn",
  ...
  "scripts": {
    "start": "nodemon server.js --exec babel-node"
  },
  "dependencies": {
    "express": "^4.15.4",
    "nodemon": "^1.12.1"
  },
  "devDependencies": {
    "babel-cli": "^6.26.0",
    "babel-core": "^6.26.0",
    "babel-preset-env": "^1.6.0",
    "babel-register": "^6.26.0",
    "jasmine": "^2.8.0"
  }
}

index.html文件：

<!DOCTYPE html>
<html lang="en">
<head> ... </head>
<body>
    <h1>Hello Word!</h1>
    <script src="pages/member/MemberController.js"></script>
</body>
</html>

您是否使用babel的webpack将您的ES6代码转换为ES5代码？一旦您设置了webpack，就会有一个名为“babel loader”的加载程序为您进行转换