2017-02-10 70 views
2

我正在开发一个集成了react,redux和firebase的项目。 react-redux-firebase似乎是一个方便的工具。但是,代码没有成功编译。以下是错误,webpack.config.js,.babelrc和index.js。提前感谢您的帮助。react-redux-firebase,“您可能需要一个合适的加载程序来处理这种文件类型。”

错误消息:

ERROR in ./~/react-redux-firebase/src/connect.js 
Module parse failed: 
/Users/xiqianglin/ucsdflyers/node_modules/react-redux-firebase/src/connect.js 
Unexpected token (43:24) You may need an appropriate loader to handle this file type. 
|  } 
| 
|  static contextTypes = { 
|  store: PropTypes.object.isRequired 
|  }; 
@ ./~/react-redux-firebase/src/index.js 1:0-31 @ ./src/index.js @ multi ./src/index.js 


/****And there are other similar errors, all "...appropriate loader..." ***/ 

webpack.config.js

var HtmlWebpackPlugin = require('html-webpack-plugin'); 
var HTMLWebpackPluginConfig = new HtmlWebpackPlugin({ 
    template: __dirname + '/src/index.html', 
    filename: 'index.html', 
    inject: 'body' 
}); 

module.exports = { 
entry: [ 
     './src/index.js' 
     ], 

module: { 
     loaders: [ 
        {test: /\.js$/, 
        exclude: /node_modules/, 
        loader:'babel-loader'} 
       ] 
     }, 

resolve: { 
    extensions: [".js", ".jsx", ".es6"] 
}, 

output: { 
     filename: "index_bundle.js", 
     path: __dirname + '/dist' 
     }, 

plugins: [HTMLWebpackPluginConfig] 
}; 

.babelrc

{ 
    "presets": ["react", "es2015"] 
} 

index.js

/*Other Imports...*/ 
import { firebaseStateReducer } from 'react-redux-firebase'; //This is the line causing error 

ReactDOM.render(
    <Provider> 
    <App/> 
    </Provider>, 
    documeng.getElementById('app') 
) 

回答

0

Duble检查你的npm install -ed所有你的依赖。

那么,如果还是不行,请尝试以下:

npm install babel-preset-es2015

后添加对ES2015的查询您的exclude

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

如果您需要包括特定的节点模块,请尝试包括您的源代码目录以及由babel-loader解析的特定节点模块文件夹。 因此,而不是在exclude: /node_modules/,尝试

include: [ 
    path.resolve(__dirname, "src"), 
    path.resolve(__dirname, "node_modules/react-redux-firebase") 
    ] 
+0

我都“ES2015”和.babelrc“反应”。而且我也按照你的建议做了,错误依然存在 – BeLikeJo

+0

我用另一件你可以尝试的东西更新了我的答案。我可能需要包含你的'react-redux-firebase',而不是排除你所有的node_modules文件夹。 –

+0

感谢您的后续评论。不幸的是,我试过了,仍然错误依然存在。 – BeLikeJo

相关问题