Next.js 如何将供应商脚本导入nextjs_Next.js

Next.js 如何将供应商脚本导入nextjs

next.js

Next.js 如何将供应商脚本导入nextjs,next.js,Next.js,我的应用程序需要一个不在npm上的脚本，因此我的项目文件夹中有该文件，但我如何在我的nextJs应用程序中使用它我已尝试将脚本放入public文件夹，然后使用next/head： <Head> <script type="text/javascript" src="/public/CustomEase.min.js"></script> </Head> 但是找不到脚本。只需使用src=“/Cust

我的应用程序需要一个不在npm上的脚本，因此我的项目文件夹中有该文件，但我如何在我的nextJs应用程序中使用它

我已尝试将脚本放入

public

文件夹，然后使用

next/head

：

<Head>
  <script type="text/javascript" src="/public/CustomEase.min.js"></script>
</Head>

但是找不到脚本。

只需使用

src=“/CustomEase.min.js”

。

public

文件夹是您的公共URL的根文件夹。

hmmm，这就是我加载供应商脚本的方式，即jQuery。如果您托管其资产资源文件，则将该文件移动到

Public

文件夹中，然后您应该能够使用相对路径访问该文件：

注意：将“/”放在路径名中很重要，因为下一步将开始在路径名中假装页面名…特别是当您执行动态路由时，即

页面->随机页面->[param]。如果排除/
，js

可能会导致

/randompage/js/somefile.js

到您的资源路径中

const Layout = ({ children }) => {
  return (
    <>
      <Head>
        <meta charSet="utf-8" />
        <meta httpEquiv="X-UA-Compatible" content="IE=edge" />
        <link rel="icon" type="image/png" href="/favicon.png"></link>
        <title>Title Here</title>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
        <link rel="stylesheet" href="/css/somefile.css" />
        <script src="/js/somefile.js"></script>
      </Head>
      {children}
      <script src="/js/somefile.js"></script>
    )
}
export default Layout

const布局=（{children}）=>{
返回(
标题在这里
{儿童}
)
}
导出默认布局

全局加载脚本的正确位置在哪里？您可以将其放在（如布局组件）的

头标记中，或放在自定义\u document.js
文件中：将脚本全局加载的正确位置在哪里？@MarkSteggles您可以将其放在根级组件的任何位置，只需确保实际资产在您的Public
文件夹中即可。静态文件和资产应该公开，以便正确构建项目。我认为您做对了，只需将/public/*
从资源路径中删除，因为Next足够聪明，可以知道静态文件位于public
文件夹中。试试看：