reactjs - 无法在react-native-web 上运行webpack-dev-server。错误: You may need an appropriate loader to handle this file type

Question

我正在尝试深入 React 生态系统，但在将 react-native-web 与我的 React Native 应用程序一起使用时遇到问题。我已在https://github.com/thedarklord1/testNativeWithWeb上托管了该应用程序。我使用 Redux Store 和 React Native 构建了一个非常简单的 POC 来构建计算器。 Android 和 iOS 版本均按预期执行。我面临的问题是，在尝试运行 webpack-dev-server 时，将 react-native-web 用于网络，失败并出现错误

ERROR in ./src/App.js
Module parse failed: /Users/abhishekkumar/Desktop/Credifiable/front_end/testNativeWithWeb/src/App.js Unexpected token (9:6)
You may need an appropriate loader to handle this file type.
|   render() {

|     return (
|       <Provider store={store}>
|         <AppContainer/>
|       </Provider>
 @ ./index.web.js 1:0-28
 @ multi (webpack)-dev-server/client?http://localhost:8080 webpack/hot/dev-server ./index.web.js

我对 React 和 WebPack 生态系统相当陌生，非常感谢任何帮助或指示。 TIA。

编辑: 我使用命令 webpack-dev-server -d --config web/webpack.config.js --inline --hot --colors 来运行服务器。

Answer 1

您需要转换为 es2015，因为大多数浏览器本身并不理解现代 JS。

loaders: [
        {
            test: /\.js$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
                presets: ['es2015', 'stage-0', 'react']
            }
        }
    ]

将加载程序添加到您的 webpack 配置中。那么它应该可以工作。