Javascript 箭头函数转换无法传输从导入模块中导出的箭头函数,IE11中出现错误
目前,我的项目有一个问题,那就是我的箭头函数无法从我自己导入的模块进行传输。我试着用我的例子来解释: 这是我的.babelrc文件Javascript 箭头函数转换无法传输从导入模块中导出的箭头函数,IE11中出现错误,javascript,reactjs,webpack,arrow-functions,babel-loader,Javascript,Reactjs,Webpack,Arrow Functions,Babel Loader,目前,我的项目有一个问题,那就是我的箭头函数无法从我自己导入的模块进行传输。我试着用我的例子来解释: 这是我的.babelrc文件 { "plugins": [ "transform-object-rest-spread", "transform-object-assign", "transform-class-properties", "react-html-attrs", "syntax-dynamic-import", "react-ho
{
"plugins": [
"transform-object-rest-spread",
"transform-object-assign",
"transform-class-properties",
"react-html-attrs",
"syntax-dynamic-import",
"react-hot-loader/babel",
"transform-es2015-arrow-functions",
"transform-es2015-function-name",
"transform-es2015-shorthand-properties"
],
"presets": [
[
"env",
{
"targets": {
"browsers": [
"Chrome >= 52",
"FireFox >= 44",
"Safari >= 7",
"ie >= 9",
"last 4 Edge versions"
]
},
"useBuiltIns": true,
"debug": true
}
],
"react",
"es2015"
]
}
这是我的package.json
"devDependencies": {
"babel-core": "^6.26.0",
"babel-loader": "^7.1.5",
"babel-plugin-react-html-attrs": "^2.1.0",
"babel-plugin-transform-class-properties": "^6.24.1",
"babel-plugin-transform-es2015-arrow-functions": "^6.22.0",
"babel-plugin-transform-es2015-function-name": "^6.24.1",
"babel-plugin-transform-es2015-shorthand-properties": "^6.24.1",
"babel-plugin-transform-object-assign": "^6.22.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.6.1",
"babel-preset-es2015": "^6.24.1",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-0": "^6.24.1",
"babel-preset-stage-3": "^6.24.1",
"webpack": "^3.1.0",
"webpack-hot-middleware": "2.18.2",
"webpack-merge": "4.1.0",
"webpack-node-externals": "^1.7.2"
}
这是我在webpack.config中的babel loader配置
module: {
rules: [
{
test: /\.js[x]$/,
exclude: /(node_modules|bower_components)/,
use: {
loader: "babel-loader"
}
},
{ test: /\.(png|jpg|jpeg|gif|svg|woff|woff2|eot|ttf)$/, use: 'url-loader?limit=25000' }
]
}
通过这些配置,我尝试了两个示例,即当arrow函数位于根组件中时,它确实将arrow函数传输到脚本中,但当我从其他文件导入函数时,它将arrow函数导入到我的组件中,并在IE11中出错
第一个例子是工作:
import React from 'react';
const testing = data => {
console.log(data);
return data;
}
class App extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>{testing("Hi, this is testing.")}</div>
)
}
}
箭头函数转换不会将示例2testing.jsxtestingFunction()转换为现代javascript
是不是我错过了什么,为我蹩脚的英语感到抱歉。
多谢各位
import React from 'react';
import testing from "./testing"
class App extends React.Component {
constructor(props) {
super(props);
}
render() {
return (
<div>{testing("Hi, this is testing.")}</div>
)
}
}
const testingFunction = data => {
return data;
};
export default function testing(data){
return testingFunction(data);
}