Javascript Webpack 2目标节点没有'；编译JSX_Javascript_Node.js_Webpack

Javascript Webpack 2目标节点没有'；编译JSX

javascript node.js webpack

Javascript Webpack 2目标节点没有'；编译JSX,javascript,node.js,webpack,Javascript,Node.js,Webpack,我正在用React构建一个通用JS应用程序，并使用Webpack2捆绑我的服务器端代码在构建服务器端代码时，webpack似乎没有传输JSX，因为我遇到了以下错误：。克隆它，点击npm安装，然后在终端上运行build:backend ERROR in ./server/router.js Module parse failed: webpack-target-node\server\router.js Unexpected token (8:31) You may need an appro

我正在用React构建一个通用JS应用程序，并使用Webpack2捆绑我的服务器端代码

在构建服务器端代码时，webpack似乎没有传输JSX，因为我遇到了以下错误：

。克隆它，点击npm安装，然后在终端上运行build:backend

ERROR in ./server/router.js
Module parse failed: webpack-target-node\server\router.js Unexpected token (8:31)
You may need an appropriate loader to handle this file type.
| export default (req, res) => {
|   match({ routes, location: req.url }, (err, redirect, props) => {
|     const app = renderToString(<RouterContext {...props} />);
|
|     const html = `
 @ ./server.js 3:0-46

server.js

server/router.js

从“React”导入React；
从'react dom/server'导入{renderToString}；
从“react router”导入{match，RouterContext}；
从“../shared/routes”导入路由器
导出默认值（请求、恢复）=>{
匹配（{routes，location:req.url}，（err，redirect，props）=>{
//这就是构建过程失败的地方
const app=renderToString（）；
常量html=`
${app}
`;
res.send（html）；
})
}

您告诉Webpack将

.jsx

文件传递给Babel加载程序：

test: /\.jsx$/,
loader: 'babel',

但是，您的JSX包含在

.js

文件中，如

server/router.js

，因此您应该扩展测试以匹配

.js

和

.JSX

：

test: /\.jsx?$/

另外，您必须从Babel loader配置中删除

include

属性，因为这意味着加载程序应该处理的文件必须存在于

/shared

目录中，而

/server/router.js

不存在。

谢谢您的回答，但它没有解决问题，仍然抛出相同的错误：（@AbrahamHurtado我发现了问题，请参阅我的编辑（关于网页配置中的

include

属性）。天哪，成功了！非常感谢！）

import React from 'react';
import { renderToString } from 'react-dom/server';
import { match, RouterContext } from 'react-router';
import router from '../shared/routes'

export default (req, res) => {
  match({ routes, location: req.url }, (err, redirect, props) => {
    // here is where the building process fails
    const app = renderToString(<RouterContext {...props} />);

    const html = `
    <html lang="en">
      <head>
          <title></title>
          <meta charset="UTF-8">
          <meta name="viewport" content="width=device-width, initial-scale=1">
          <link href="css/style.css" rel="stylesheet">
      </head>
      <body>
        <div id="react-app">${app}</div>
        <script type="text/javascript" src="/bundle.js"></script>
      </body>
    </html>`;

    res.send(html);
  })
}

test: /\.jsx$/,
loader: 'babel',

test: /\.jsx?$/