下一个带有相对反应熔断器路径的 js 问题

问题描述

你好我在前端使用 React Fuse 和 Nextjs 来运行服务器。但是 Next 的相对熔断路径有问题，例如相对路径 @history 导致模块未找到错误！。有没有办法解决这个问题？

import history from '@history';

解决方法

从 Next.js 9.5.4 开始支持。按照 nextjs 文档的说明进行操作：

自 Next.js 9.5.4 起，允许从 node_modules 导入 CSS 文件在您的应用程序中的任何位置。

对于全局样式表，比如 bootstrap 或 nprogress，你应该导入 pages/_app.js 里面的文件。例如：

// pages/_app.js
import 'bootstrap/dist/css/bootstrap.css'

export default function MyApp({ Component,pageProps }) {
  return <Component {...pageProps} />
}

导入第三方组件需要的CSS，你可以这样做 在您的组件中。例如：

// components/ExampleDialog.js
import { useState } from 'react'
import { Dialog } from '@reach/dialog'
import '@reach/dialog/styles.css'

function ExampleDialog(props) {
  const [showDialog,setShowDialog] = useState(false)
  const open = () => setShowDialog(true)
  const close = () => setShowDialog(false)

  return (
    <div>
      <button onClick={open}>Open Dialog</button>
      <Dialog isOpen={showDialog} onDismiss={close}>
        <button className="close-button" onClick={close}>
          <VisuallyHidden>Close</VisuallyHidden>
          <span aria-hidden>×</span>
        </button>
        <p>Hello there. I am a dialog</p>
      </Dialog>
    </div>
  )
}