react导入的插件不支持服务端渲染报错的解决方法


正常的导入方法如下:

import { useEffect, useState, useRef } from 'react';

如果不支持服务端渲染的插件这样导入则会报错(具体的报的什么错我忘了),一般情况下使用require动态导入就好了,但有的时候不支持require的方式导入,这时候就可以用以下方式动态导入:

  const [photo, setPhoto] = useState(null);

  // 页面渲染完成之后再动态导入
  useEffect(() => {
    import('某个不支持服务端渲染的插件').then(res => {
      setPhoto(res);
    })
  }, [])