时间戳

首页 > 解决方案 > React Draft 所见即所得不会加载 CSS 样式

javascript - React Draft 所见即所得不会加载 CSS 样式

问题描述

我正在开发一个使用create-react-library 创建的 React 库。效果很好，现在我想实现一个 html 文本编辑器。我为此选择了react-draft-wysiwyg。我遇到了2个问题：

  1. 添加Editor和EditorState到我的组件：

    import {Editor} from 'react-draft-wysiwyg'; import {EditorState} from 'draft-js';

Rollup 无法解析必要的 Editor 和 EditorState 类。它给出了错误“name-is-not-exported-by-module”。在搜索和尝试之后，我通过将这些行添加到 rollup.config.js 来解决这个问题：

commonjs({
        namedExports: {
            'node_modules/draft-js/lib/Draft.js': [ 'EditorState' ],
            'react-draft-wysiwyg': [ 'Editor' ]

        }
    }),

现在编辑器出现了。

  1. 加载 CSS

import 'react-draft-wysiwyg/dist/react-draft-wysiwyg.css';

样式也不会加载，但这一次，控制台中没有显示警告，它们只是不加载。

任何想法如何解决这个问题？

标签： javascriptnode.jsreactjscreate-react-approllupjs

解决方案

在此处输入图像描述

你看到这样的东西吗？你能试试这个看看，导入'../node_modules/react-draft-wysiwyg/dist/react-draft-wysiwyg.css';

我使用的是同一个编辑器，但从未遇到过上述任何问题。你确定它安装正确吗？因为你面临的第一个问题是这样的。

推荐阅读