在我的项目中引入react-slick组件来实现图片的轮播展示
import React, { Component } from 'react'
import Slider from 'react-slick/src/slider'
class StartupsImgBlock extends Component {
render(){
return (
<div className='user-me-card'>
<Slide></Slide>
</div>
)
}
}
export default StartupsImgBlock
但是在编译时报错,在我的项目中都是通过ES6 class 定义的组件,而slider组件是通过定义React.createClass的方式,下面是报错信息,我需要重新定义一个loader去解析这个slider文件?
ERROR in ./~/react-slick/src/slider.js
Module parse failed: /Users/Libbbbc/works/circle-web/node_modules/react-slick/src/slider.js Unexpected token (82:8)
You may need an appropriate loader to handle this file type.
SyntaxError: Unexpected token (82:8)
at Parser.pp.raise (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:920:13)
at Parser.pp.unexpected (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:1483:8)
at Parser.pp.parseExprAtom (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:330:12)
at Parser.pp.parseExprSubscripts (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:225:19)
at Parser.pp.parseMaybeUnary (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:204:17)
at Parser.pp.parseExprOps (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:151:19)
at Parser.pp.parseMaybeConditional (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:133:19)
at Parser.pp.parseMaybeAssign (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:110:19)
at Parser.pp.parseParenAndDistinguishExpression (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:373:28)
at Parser.pp.parseExprAtom (/Users/Libbbbc/works/circle-web/node_modules/.npminstall/acorn/3.1.0/acorn/dist/acorn.js:304:19)
@ ./webpack/javascripts/react/routes/web/dashboard/components/startups/detail/StartupsImgBlock.js 15:14-47
我的webpack配置中loader的配置是这样的:
loaders: [
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'react-hot',
},
{
test: /\.jsx?$/,
exclude: /node_modules/,
loader: 'babel-loader',
query: {
presets: ['es2015', 'react']
}
}
]
怎么解决这个问题呢?
这个是slider文件https://github.com/akiran/rea...
import 人家的源文件干嘛。
import Slider from 'react-slick'