时间戳

首页 > 解决方案 > 在固定数据表 2 中导入 CSS 文件时出错

reactjs - 在固定数据表 2 中导入 CSS 文件时出错

问题描述

我正在使用固定数据表 2（0.8.13）和 React（15.4.2）。但是，当我导入 CSS 文件时，出现错误

模块解析失败：/Users/Desktop/ReactReduxStore/node_modules/fixed-data-table-2/dist/fixed-data-table.css 意外令牌 (23:0) 您可能需要适当的加载程序来处理此文件类型。

我按如下方式导入它：

import 'fixed-data-table-2/dist/fixed-data-table.css';

标签： reactjswebpack

解决方案

你必须添加css加载器来导入它们，

添加css-loader和style-loader：

npm install --save-dev css-loader style-loader

然后webpack.config.js执行以下操作：

module.exports = {
  ...
  module: {
    rules: [
      { 
        loader: 'babel-loader', 
         test: /\.js$/, 
         exclude: /node_modules/ 
      },{
        test: /\.css$/,
        use: ['style-loader', 'css-loader']
      }
    ]
  },
  ...
}

注意：

module.loaders在 Webpack v1 中现在module.rules在 Webpack v2+ 中。旧的加载器配置被更强大的规则系统所取代，它允许配置加载器等等。出于兼容性原因，旧的 module.loaders 语法仍然有效并且旧名称被解析。新的命名约定更容易理解，并且是升级配置以使用 module.rules 的一个很好的理由。

推荐阅读