Webpack 捆绑包验证，但节点服务器抛出语法错误

Webpack bundle validates but node server throwing syntax error

本文关键字：服务器 节点 错误 语法 包验证 验证 Webpack      更新时间：2023-09-26

我正在使用webpack来捆绑/转换jsx。

从命令行我正在运行"webpack --watch"。这将创建我的捆绑包而没有错误。这是我的 webpack 配置和应用程序.js

'use strict';
var webpack = require('webpack');
module.exports = {
    resolve: {
        extensions: ['', '.js']
    },
    devtool: 'eval',
    entry: './client.js',
    output: {
        path: __dirname+'/build/js',
        filename: 'client.js'
    },    
    module: {
        loaders: [
            { test: /'.css$/, loader: 'style!css' },
            { test: /'.js$/, loader: 'jsx-loader?harmony' }
        ]
    }
};

var React = require('react'),
    classSet = require('react/addons'),
    Nav = require('./Nav.js'),
    Home = require('./Home.js'),
    Recipe = require('./Recipe.js'),
    RecipeArchive = require('./RecipeArchive.js'),
    About = require('./About.js'),
    Timestamp = require('./Timestamp.js'),
    RouterMixin = require('flux-router-component').RouterMixin;
var Application = React.createClass({
    mixins: [RouterMixin],
    getInitialState: function () {
        this.store = this.props.context.getStore('ApplicationStore');
        return this.store.getState();
    },
    componentDidMount: function () {
        var self = this;
        self._changeEventListener = function () {
            var state = self.store.getState();
            self.setState(state);
        };
        self.store.on('change', self._changeEventListener);
    },
    componentWillUnmount: function () {
        var self = this;
        self.store.removeListener('change', self._changeEventListener);
        self._changeEventListener = null;
    },
    render: function () {
        return (
            <div>test</div>
        );
    }
});
module.exports = Application;

然后我正在运行我的节点服务器，该服务器会引发错误。

node server.js

结果在：

/Users//Documents/routing/components/Application.js:39
        <div>test</div>
        ^
SyntaxError: Unexpected token <

我应该如何运行我的项目以允许我在.js文件中包含 jsx/harmony？

更新：解决方案

正如 Brandon 指出的，我需要使用 node-jsx 在 Node 中进行转换。在我添加的服务器.js文件的顶部，所有文件都可以正常工作：

require('node-jsx').install({ extension: '.js', harmony: true });

Webpack 只创建一个客户端捆绑包;当你运行 Node 应用程序时，它不使用 webpack 来加载文件。以前，你可以使用类似node-jsx的东西来要求Node.js中的JSX文件，但该项目已被弃用，取而代之的是Babel。特别是，您可以使用 babel-register 来要求 Node 中的 JSX 文件。

相关文章：