小编Sam*_*lah的帖子

在 Next Js 中导入脚本文件的正确方法是什么？

我试图使用 bootstrap 模板，但由于无法导入 JS，CSS 文件已正确导入。我发现在 Next Js 中你可以将它们导入 useEffect hook 中。但仍然给出了找不到脚本的错误。这是我的代码，

import Head from 'next/head';
import '../styles/globals.css';
import { useEffect } from 'react';

function MyApp({ Component, pageProps }) {
  useEffect(() => {
    import("../public/lib/js/jquery-3.3.1.min.js");
    import("../public/lib/js/bootstrap.min.js");
    import("../public/lib/js/jquery.nice-select.min.js");
    import("../public/lib/js/jquery-ui.min.js");
    import("../public/lib/js/jquery.slicknav.js");
    import("../public/lib/js/mixitup.min.js");
    import("../public/lib/js/owl.carousel.min.js");
    import("../public/lib/js/main.js");
  }, []);
  return (
      <>
      <Head>

        <meta charset="UTF-8"/>
        <meta name="keywords" content="Ogani, unica, creative, html"/>
        <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
        <meta http-equiv="X-UA-Compatible" content="ie=edge"/>

        {/* Font */}
        <link href="https://fonts.googleapis.com/css2?family=Cairo:wght@200;300;400;600;900&display=swap" rel="stylesheet"/>
        {/* CSS */}
        <link rel="stylesheet" href="lib/css/bootstrap.min.css" type="text/css"/>
        <link rel="stylesheet" href="lib/css/font-awesome.min.css" type="text/css"/>
        <link rel="stylesheet" …

Run Code Online (Sandbox Code Playgroud)

javascript jquery reactjs bootstrap-4 next.js

Sam*_*lah

2022 06-13

3
推荐指数

1
解决办法

1万
查看次数