为什么“npm run dev”不能在新的“npx create-next-app”上工作?

2024-01-05

我刚刚创建了一个新的 Next 应用程序npx create-next-app。看起来已经成功运行了:

$ npx create-next-app                                                             [8:46:31]

npx: installed 1 in 8.826s
✔ What is your project named? … sightsee
✔ Would you like to use TypeScript with this project? Yes
✔ Would you like to use ESLint with this project? Yes
✔ Would you like to use Tailwind CSS with this project? Yes
✔ Would you like to use `src/` directory with this project? Yes
✔ Would you like to use experimental `app/` directory with this project? No
✔ What import alias would you like configured? … @/*
Creating a new Next.js app in /Users/name/sideProjects/sightsee.

Using npm.

Initializing project with template: default-tw


...
... irrelevant output
...
+ [email protected] /cdn-cgi/l/email-protection
+ [email protected] /cdn-cgi/l/email-protection
added 329 packages from 271 contributors and audited 338 packages in 182.455s

116 packages are looking for funding
  run `npm fund` for details

found 0 vulnerabilities

Success! Created sightsee at /Users/name/sideProjects/sightsee.

Then I cd sightsee; npm run dev:

name@MacBook-Pro-3: ~/sideProjects/sightsee main!
$ npm run dev                                                                     [9:30:12]

> [email protected] /cdn-cgi/l/email-protection dev /Users/name/sideProjects/sightsee
> next dev


name@MacBook-Pro-3:~/sideProjects/sightsee main!

通常它会说类似的话running on port localhost:3000.

npm run build

$ npm run build                                                                   [9:29:43]

> [email protected] /cdn-cgi/l/email-protection build /Users/name/path/project next build

uncaughtException Error: Cannot find module 'node:buffer'
...
...
FAIL

我刚刚创建了这个项目,为什么没有任何效果?

我尝试重新安装节点模块,重新安装npx,都没有效果。

Why is npx create-next-app创建一个无法运行的应用程序?


检查当前使用的节点版本,如果是旧版本可能会出现此错误;

为了检查当前运行的版本

node -v

用于更新到新的 LTS 版本

nvm安装18

在运行 npm run dev 或 build 之前确保 nvm 使用新版本

nvm使用18

Then

npm 运行构建

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

为什么“npm run dev”不能在新的“npx create-next-app”上工作? 的相关文章

  • 如何向 Next.js 静态站点添加网站图标?

    我正在尝试将网站图标添加到 Next js 静态站点 但运气不佳 我尝试使用以下组件自定义文档 next document https nextjs org docs custom document https nextjs org doc
  • 在 next.js 中调用 API 并避免 CORS 错误的最佳实践

    我正处于设置 next js 应用程序的早期阶段 到目前为止我只有使用 React 的经验 我在 localhost 3000 上设置了一个前端应用程序 next js 在 localhost 5000 上设置了一个后端应用程序 node
  • 连接 Apollo 和 mongodb

    我想将我的 Apollo 服务器与我的 mongoDB 连接 我知道那里有很多例子 但我陷入了异步部分 没有找到解决方案或示例 这很奇怪 我完全错了吗 我从 next js 的示例开始https github com zeit next j
  • Next js 子组件的父路由组件

    让我们想象一下我们有admin有几个页面的模块定制 settings account 这些页面中的每一个都应该有一些通用的布局 sidebar 对于标准 React 应用程序 我将做下一步来实现应用程序的这一部分 我会创建父路线 admin
  • 如何删除 Next.js 中 id="__next" 的 div

    我正在使用 Next js 制作一个网站 我想要一个标题position sticky 行为 然而 Next js 自动生成一个带有属性的 divid next 未经我的许可在我的网站的根目录中 我需要删除该 div 以便position
  • 类型错误:无法读取 null 的属性(读取“useRef”)

    我正在使用 Next js TypeScript sanity 和 tailwindcss 我尝试使用react hook form 但收到错误 我试过了 改变Post函数到箭头函数 改变Post函数到 const 函数 改变IFormIn
  • 无法在 _app.js 中使用 getStaticProps

    我正在使用 next js 并尝试执行以下操作 获取 app js中与用户数据相关的基本数据 该数据包括标题 用于导航栏 和一些社交链接 用于页脚 在构建时将该数据传递给其他组件 例如页脚和导航栏 用于静态站点生成 为此我已经导出了getS
  • Next.js API 路由神秘地修改 JSON 负载

    由于某种原因 当我通过 Postman 作为原始文本发送 JSON 格式的数据时 没有任何问题 当我通过 Postman 发送与原始 JSON 完全相同的数据时 区别应该只是content type标头是application json代替
  • 在 Next.js 13 中使用标记为“use client”的提供程序包装整个应用程序

    我正在 Next js 中开发一个小型应用程序 但我还没有完全理解客户端与服务器端渲染的情况 我一直在工作这个伟大的指南 https www misha wtf blog supabase auth next 13 pkce关于使用 Sup
  • next-auth google 提供商无法正常工作,访问被阻止:此应用程序的请求无效

    这整个星 期我都在摸索 我已经尝试了几乎所有的方法 我正在尝试使用 next auth google 提供商 在 GCP 中 在授权网址和重定向网址中 本地主机 3000 真实域名网站 本地主机 3000 api auth callback
  • 无法从静态文件夹加载图像

    如何在 Next js 的组件中加载图像 我必须先构建项目吗 如果是 有没有办法在不先构建的情况下加载图像 无论我如何尝试 我都无法让它发挥作用 来自文档 https nextjs org docs basic features stati
  • SyntaxError:无法在动态导入 Nextjs 的模块外部使用 import 语句

    我遵循了SunEditor的文档 它是这样的 import React from react import dynamic from next dynamic import suneditor dist css suneditor min
  • 如何在 getStaticPaths 内添加 params 值数组

    我有一个页面 其结构如下 read slug number 我想要得到slug每个对应的值number in the getStaticPaths这是代码 export async function getStaticPaths const
  • Python 无服务器函数 Vercel - Next.js

    我发现我可以使用 Python 在内部创建一个无服务器函数Next js https nextjs org docs getting started项目 一旦部署到Vercel https vercel com 它将被转换为无服务器函数 我
  • Next.js:错误:React.Children.only 期望接收单个 React 元素子元素

    我有一个名为Nav inside components目录及其代码如下所示 import Link from next link const Nav gt return div a Home a a About a div export d
  • 下一张图片不采用类属性

    我正在使用 Next js 和next image显示图像 但 CSS 在其中不起作用 该图像是 SVG 格式 我已将其放在公共文件夹中 我正在使用 Tailwind CSS 与此一起使用
  • 如何仅在 NextJS 站点构建期间使用 getInitialProps?

    当使用 NextJS 构建静态站点时 我想要getInitialProps方法仅在构建步骤期间触发 而不是在客户端上触发 在构建步骤中 NextJS 运行getInitialProps 方法 https nextjs org docs fe
  • 如何在 NextJS 中设置 AWS-SDK 凭证

    我需要从 NextJs 应用程序将一些文件上传到 S3 由于它是服务器端 我的印象是简单地设置环境变量应该可以工作 但事实并非如此 我知道还有其他选择 例如为 EC2 分配角色 但我想使用 accessKeyID 和 SecretKey 这
  • 我想将我的 NEXT.js 项目链接到静态网站

    我有一个使用 HTML CSS 开发的网站 它是一个静态网站 但现在我使用 NEXT js 与 Strapi API 集成创建了一个博客项目 我的问题是如何将我的静态网站与我的 Next js 项目链接起来 我尝试使用链接标签 但没有用 i
  • Antd datepicker (date.clone/date.load 不是函数)

    我有一个反应应用程序 有一个复选框可以禁用日期选择器 但当我使用复选框禁用它时 我无法选择任何日期 如果我删除复选框及其功能 则不会出现错误 目前 我得到 date clone 不是函数 error const dateFormat YYY

随机推荐