每当我试图构建或只是运行开发服务器使用nextjs,我得到以下错误:
unhandledRejection C:\proj\node_modules\@ionic\react\dist\index.js:1
import React, { useContext, useRef, useEffect, createElement, useState, useMemo, Fragment, useCallback } from 'react';
^^^^^^
SyntaxError: Cannot use import statement outside a module
at internalCompileFunction (node:internal/vm:73:18)
at wrapSafe (node:internal/modules/cjs/loader:1175:20)
at Module._compile (node:internal/modules/cjs/loader:1219:27)
at Module._extensions..js (node:internal/modules/cjs/loader:1309:10)
at Module.load (node:internal/modules/cjs/loader:1113:32)
at Module._load (node:internal/modules/cjs/loader:960:12)
at Module.require (node:internal/modules/cjs/loader:1137:19)
at require (node:internal/modules/helpers:121:18)
at 244 (C:\proj\.next\server\pages\_app.js:50:31)
at __webpack_require__ (C:\proj\.next\server\webpack-runtime.js:25:42) {
type: 'SyntaxError'
}
字符串
我使用的是next-transile模块:
const withTM = require("next-transpile-modules")([
"@ionic/react",
"@ionic/core",
"@stencil/core",
"ionicons",
]);
module.exports = withTM({
basePath: "'./src",
swcMinify: true,
});
型
My app.tsx:
import Head from "next/head";
import Script from "next/script";
/* Core CSS required for Ionic components to work properly */
import "@ionic/react/css/core.css";
import "../css/global.css";
/* Basic CSS for apps built with Ionic */
import "@ionic/react/css/normalize.css";
import "@ionic/react/css/structure.css"; // Remove if nothing is visible
import "@ionic/react/css/typography.css";
/* Optional CSS utils that can be commented out */
import "@ionic/react/css/padding.css";
import "@ionic/react/css/float-elements.css";
import "@ionic/react/css/text-alignment.css";
import "@ionic/react/css/text-transformation.css";
import "@ionic/react/css/flex-utils.css";
import "@ionic/react/css/display.css";
import { setupIonicReact } from "@ionic/react";
setupIonicReact();
function MyApp({ Component, pageProps }) {
return (
<>
<Head>
<title>Create Next App</title>
<meta name="description" content="Generated by create next app" />
<meta
name="viewport"
content="width=device-width, initial-scale=1, viewport-fit=cover"
/>
</Head>
<Component {...pageProps} />
<Script
type="module"
src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.esm.js"
></Script>
<Script
noModule
src="https://unpkg.com/[email protected]/dist/ionicons/ionicons.js"
></Script>
</>
);
}
export default MyApp;
型
我的tsconfig模块被设置为“esnext”,类型是package.json中的模块。我使用的是nextjs版本“13.4.2”和@ionic/react版本“7.0.0”。任何帮助都非常感谢。
我之前使用vite,它还能工作,但是切换到nextjs后,它就停止工作了。
我试过和那些人打架,但都没用。
1条答案
按热度按时间gz5pxeao1#
好吧,看来只是重新安装为我工作。