使用webpack和babel编译ES6资源时出错：
You may need an appropriate loader to handle this file type.
| import React from 'react';
| /*
| import { render } from 'react-dom'
【webpack和babel出错（You may need an appropriate loader to handle this file type.）】下面是webpack配置：
var path = require('path');
var webpack = require('webpack');
module.exports = {
entry: './index',
output: {
path: path.join(__dirname, 'dist'),
filename: 'bundle.js',
publicPath: '/dist/'
},
module: {
loaders: [
{
test: /\.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/
}
]
}
}
解决办法
1、安装es2015预设：
npm install babel-preset-es20152、然后配置babel-loader：
{
test: /\.jsx?$/,
loader: 'babel-loader',
exclude: /node_modules/,
query: {
presets: ['es2015']
}
}
推荐阅读
- webpack babel-loader将jsx转换为js错误（build failed SyntaxError ~main.js Unexpected token）
- webpack和babel项目使用ES6装饰器错误（Decorators are not supported yet in 6.x pending proposal update.）
- AdSense申请失败解决办法（我们发现，您还有一个 AdSense 帐号。每位用户只能拥有一个帐号。要使用此帐号，请关闭另一个帐号。）
- JS如何实现二叉堆（JavaScript实现最小二叉堆和优先队列）
- JavaScript常用数据结构之线性表（数组和链表）
- 数组和链表有什么区别（哪个更快？有什么优缺点？有哪些应用场景？）
- JavaScript常用数据结构（栈(Stack)详解）
- JavaScript基本数据结构（队列基本原理和实现）
- 倒排索引（反向索引）详细介绍