Webpack导入没有转换Babel代码

时间:2016-01-24 17:08:56

标签: webpack babeljs

我正在使用React和Webpack,奇怪的是当我导入一个包含React组件的类时,似乎没有发生转换,我得到了:

function class Test extends _react2.default.Component {
        constructor() {
            return _possibleConstructorReturn(this, Object.getPrototypeOf(Test).apply(this, arguments));
        }

但是当我定义内联类时,这不会发生。

主要的webpack文件:

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, Link, browserHistory } from 'react-router';

// Components
import SignUp from './components/test';

// Styles
import './styles/sass/materialize.scss';

ReactDOM.render(
    <Router history={browserHistory}>
        <Route path="/sign-up" component={SignUp} />
    </Router>,
    document.getElementById('react-hook')
);

Webpack配置:

import path from "path";
import webpack from 'webpack';

export default {
    entry: [
      path.resolve(__dirname, 'app/main.js')
    ],
    output: {
        path: path.resolve(__dirname, 'public/dist'),
        filename: 'bundle.js',
    },
    module: {
        loaders: [
            {
                test: /\.js?$/,
                exclude: /(node_modules|bower_components|lib)/,
                loader: 'babel-loader',
                query: {
                    presets: ['react','es2015']
                }
            },
            {
                test: /\.s?css$/,
                loader: 'style!css!sass'
            },
            {
                test: /\.(woff|woff2|ttf|eot|svg)$/,
                loader: 'file-loader'
            }
        ]
    },
    plugins: [
        new webpack.ProvidePlugin({
            jQuery: "jquery"
        })
    ]
};

1 个答案:

答案 0 :(得分:1)

通过重新安装所有node_modules修复了此问题。