javascript - webpack的jsx文件，用babel编译，报错，用react-tools编译正常，这是什么原因啊，是不是babel的问题啊

问题描述

问 题

webpack.config.js的配置如下：
var webpack = require('webpack');
module.exports = {

entry: {
    entry: './src/helloworld.js'
},
output: {
    path: __dirname,
    filename: './build/helloworld.js'
},
resolve: {
    extensions: ['', '.js', '.jsx']
},
module: {
    loaders: [{
        test: /\.js$/,
        exclude: /node_modules/,
        loader: 'babel-loader'
    },{
        test: /\.scss$/,
        loader: 'style!css!sass'
    },{
        test: /\.png$/,
        loader: 'url-loader?mimetype=image/png'
    },{
        test: /\.jpg$/,
        loader: 'url-loader?mimetype=image/jpg'
    }]
}

};

解决方案

那说明webpack配置有问题，亮出你的配置和使用方法

补充：

你还需要：

npm install --save-dev babel-preset-react

var webpack = require('webpack');
module.exports = {
    entry: {
        entry: './src/helloworld.js'
    },
    output: {
        path: __dirname,
        filename: './build/helloworld.js'
    },
    resolve: {
        extensions: ['', '.js', '.jsx']
    },
    module: {
        loaders: [{
            test: /\.jsx$/,
            exclude: /node_modules/,
            loader: 'babel-loader',
            query: {
                presets: ['react']
            }
        },{
            test: /\.scss$/,
            loader: 'style!css!sass'
        },{
            test: /\.png$/,
            loader: 'url-loader?mimetype=image/png'
        },{
            test: /\.jpg$/,
            loader: 'url-loader?mimetype=image/jpg'
        }]
    }
};

这篇关于javascript - webpack的jsx文件，用babel编译，报错，用react-tools编译正常，这是什么原因啊，是不是babel的问题啊的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！