使用babel-loader和webpack 3模块解析失败

时间:2017-07-31 22:49:57

标签: webpack babeljs webpack-dev-server webpack-2 babel-loader

我正在尝试使用Webpack 3和babel-loader构建我的客户端,而对于我的生活,我无法弄清楚它为什么不解析一个简单的JSX文件。它立刻失败了,给了我一个信息:

ERROR in ./Client.jsx
Module parse failed: /Users/bfitz/my-webapp/node_modules/babel-loader/lib/index.js??ref--0-0!/Users/bfitz/my-webapp/src/app/Client.jsx Unexpected token (40:8)
You may need an appropriate loader to handle this file type.
|
|     const app = (
|         <Provider store={STORE}>
|             <Router history={HISTORY}>
|                 {ROUTES}
 @ multi ./Client.jsx

这是我的网站:

const { resolve, join } = require('path')
const webpack = require('webpack')

const assetsPath = join(__dirname, '..', 'public', 'assets')

const contextPath = resolve(__dirname, '..', 'src', 'app/')

module.exports = {
    entry: {
        client: ['./Client.jsx']
    },
    output: {
        path: assetsPath,
        filename: '[name].js',
        publicPath: '/assets/'
    },
    context: contextPath,
    module: {
        rules: [
            {
                test: /\.jsx?$/,
                include: resolve(__dirname, '..', 'src', 'app/'),
                exclude: /node_modules/,
                use: [
                    {
                        loader: 'babel-loader',
                        options: {
                            presets: ['react', 'es2015', 'stage-0']
                        }
                    }
                ]
            },
            {
                test: /\.woff(2)?(\?v=[0-9]\.[0-9]\.[0-9])?$/,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            limit: '10000',
                            mimetype: 'application/font-woff',
                            name: '[name]-[hash:6].[ext]'
                        }
                    }
                ]
            },
            {
                test: /\.html$/,
                use: 'html-loader'
            },
            {
                test: /\.scss$/,
                use: ['style-loader', 'css-loader', 'sass-loader']
            }
        ]
    }
}

在服务器上,我有热重装中间件设置如下:

const devClientWebpackConfig = require('../../webpack/webpack-dev-client')

APP.use(webpackMiddleware(webpack(devClientWebpackConfig)))

我正在运行Webpack 3.4.1和Babel 6.25。 Babel-loader是7.1.1,所有插件也是6.24.1。

先谢谢,这给我带来了巨大的麻烦。

0 个答案:

没有答案