从节点模块导入 .css 文件时出错

Question

现在我正在尝试在 React-hooks 项目中使用 DatePicker。但是从节点模块导入 css 会出错。

import React, { useEffect,useState } from 'react';
import { useLocation } from 'react-router-dom';
import { useDispatch, useSelector } from 'react-redux';
import {Modal, Container, Row, Col, Button, } from 'react-bootstrap'

import { scheduleActions } from '../_actions';
import { Header } from '../_components/Header';
import DatePicker from "react-datepicker";
import "react-datepicker/dist/react-datepicker.css"; //this make error.

......

error image

我该如何解决？感谢您的任何建议。

Answer 1

这可能是因为 webpack 配置中应用的捆绑逻辑。

解决方案：

您可以使用CDN来解决问题在 head 标签内的 public/index.html 文件中添加。

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/react-datepicker/2.14.1/react-datepicker.min.css" />

万一没有帮助，您可以查看此 link： https://github.com/Hacker0x01/react-datepicker/issues/879

您可以在 src/index.js 文件而不是当前文件中导入它

从节点模块导入 .css 文件时出错

Error when I import .css file from node-module

css

import

datepicker

react-hooks