webpack编译react-slick文件报错

在我的项目中引入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...

阅读 3.3k
1 个回答

import 人家的源文件干嘛。

import Slider from 'react-slick'

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题