FIxedDataTable CSS parsing error

时间:2015-11-12 10:50:05

标签: css reactjs

I'm trying get the sample code working but getting an error

Code

import React, {Component} from "react";
import FixedDataTable from "fixed-data-table";
import {Table, Column, Cell} from 'fixed-data-table';
import './fixed-data-table.css';
var rows = [
  ['a1', 'b1', 'c1'],
  ['a2', 'b2', 'c2'],
  ['a3', 'b3', 'c3']
  // .... and more
];

class App extends Component {

  constructor(props) {
  super(props);
  this.rowGetter = this.rowGetter.bind(this);
  }



  rowGetter(rowIndex) {
    return rows[rowIndex];
  }



  render() {
    return (
      <Table
    rowHeight={50}
    rowGetter={this.rowGetter}
    rowsCount={rows.length}
    width={5000}
    height={5000}
    headerHeight={50}>
    <Column
      label="Col 1"
      width={3000}
      dataKey={0}
    />
    <Column
      label="Col 2"
      width={2000}
      dataKey={1}
    />
  </Table>
    );

  }

}


export default App;

Error

Unexpected token (23:0)
  21 |  */
  22 | 
> 23 | .fixedDataTableCellGroupLayout_cellGroup {
     | ^
  24 |   -webkit-backface-visibility: hidden;
  25 |           backface-visibility: hidden;
  26 |   left: 0;

FixedDataTable https://facebook.github.io/fixed-data-table/

I'm using https://github.com/vasanthk/react-universal-starter as the seed project.

I tried install css loaders according to https://github.com/christianalfoni/react-webpack-cookbook/wiki/Loading-CSS but no luck

1 个答案:

答案 0 :(得分:1)

Don't do this: import './fixed-data-table.css';

You need to import that css in the <head> your html with <link rel="stylesheet" type="text/css" href="fixed-data-table.css">