Closed zhangwei900808 closed 3 years ago
在 nextjs 中使用可以使用此方法解决问题 https://github.com/uiwjs/react-md-editor/issues/52#issuecomment-848969341
@zhangwei900808
@jaywcjlove 能不能把css剔除到外面引用啊,包只包含js文件
@zhangwei900808 我不是专门封装了一个工具 next-remove-imports
剔除包里面的 css 引入。
@zhangwei900808 这个里面有使用实例 https://github.com/uiwjs/react-md-editor/issues/52#issuecomment-848969341 就是使用 next-remove-imports
工具剔除 css,在你所在页面引用 @uiw/react-heat-map/dist.css
这个 css 就是专门干这个的。
@jaywcjlove 可以是可以总感觉不够优雅,配置好麻烦,要多配置三步操作! 能不能简化操作呢,我看antd不用这么麻烦,他包里面不也包含了css文件么,能不能参考它的使用方式 1、next.config.js
const removeImports = require('next-remove-imports')({
options: { },
})
module.exports = removeImports()
2、component.js
import dynamic from "next/dynamic";
const HeatMap = dynamic(
() => import("@uiw/react-heat-map").then((mod) => mod.default),
{ ssr: false }
);
3、_app.js
import '@uiw/react-heat-map/dist.css';
@zhangwei900808 在 antd 中 并没有真的,直接引入样式文件,所以不报错。但是 antd 需要在 css 中引入 antd.css
文件。
@import '~antd/dist/antd.css';
我们这个包并不是在 next 中使用的。
在其它工具中 使用 @uiw/react-heat-map
,不需要引入css 是自动导入 css,比如你在 create-react-app
、umi 等工具中使用时,不需要导入任何css
@zhangwei900808 只是整了个 next 插件(next-remove-imports
),支持在 next 中使用而已。如果改了,我们其他项目都需要去改,手动引入css。
@jaywcjlove 没必要你们所有项目都去除css啊,只是这个组件应用的样式不多可以剔除啊,不过,如果你没有时间弄,暂时就这么着吧!
我们所有项目不分离 css,引入一个组件,不需要引入这个组件的 css,属于自动加载样式 @zhangwei900808