vue3 npm run serve脚手架报错

sgl11

已于 2023-03-14 16:15:42 修改

阅读量382

点赞数

文章标签： npm vue.js javascript

于 2023-03-14 16:13:12 首次发布

本文链接：https://blog.csdn.net/sgl11/article/details/129530543

版权

在遇到Vue2项目后运行Vue3项目导致的脚手架错误，特别是esm-bundler.js文件报错，问题根源在于依赖关系迁移。文章提供了两种解决方案：1)在vue.config.js中添加`transpileDependencies:[@vue/reactivity]`，然后重启vue脚手架；2)升级vue脚手架到最新版本，使用命令`npmi-g@vue/cli`。

摘要由CSDN通过智能技术生成

npm run serve 报错

报错截图：
在这里插入图片描述
运行完vue2项目后，运行vue3项目发生脚手架报错，后缀为esm-bundler.js文件报错，具体原因为转移依赖关系报错。
解决方法：
1.在vue.config.js中添加如下语句：

transpileDependencies: ['@vue/reactivity']

添加后，重新启动vue脚手架，即可解决报错
2.升级vue脚手架版本，具体命令为：

npm i -g @vue/cli

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

sgl11

关注关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
复制链接

分享到 QQ

分享到新浪微博

扫一扫

Vue启动项目使用npm run dev还是用npm run serve

weixin_45566730的博客

06-16

2272

使用npm run dev还是npm run serve有两点原因 1. 脚手架版本号 vue-cli2使用npm run dev vue-clie3以上版本使用npm run serve 2. 配置问题如果安装的是vue-cli3可以将vue-cli2拉过来即在使用npm install -g @vue/cli安装完成脚手架之后输入命令npm install -g @vue/cli-init，然后再vue项目中的package.json中进行如下配置 "scripts": { "dev": "

vue-cli 3.0脚手架配置及扩展（六）：npm run serve 和 npm run build 拦截修改

热门推荐

Franks.T.D

06-20

2万+

修改文件为：path node_modules/@vue/cli-service/bin/vue-cli-service.js，该文件的修改基于vue-cli的版本为3.0.0-rc.2版本，这是node_modules内部文件，所以在升级vue-cli3.0时会被覆盖掉，所以建议存档，并且修改package.json中的本地开发依赖配置对象devDependencies，修改以‘@vue/’开头...

参与评论您还未登录，请先登录后发表或查看评论

使用vue3时 npm run serve报错

weixin_56797282的博客

02-07

748

查找了很多方法，最终在Error: Cannot find module '@babel/core’ - 简书找到解决办法不方便点击的，我做一些摘录，记录一下解决方法问题产生的原因 babel-loader和babel-core版本不对应所产生的， babel-loader 8.x对应babel-core 7.x babel-loader 7.x对应babel-core 6.x 如何解决 1、卸载旧的babel-corenpm un babel-core 2、安装新的babe...

VUE3.0通过脚手架创建项目运行报错的解决方案

Achong999的博客

10-01

801

VUE3.0通过脚手架创建项目运行报错的解决方案

VUE3的项目运行npm run serve报错

weixin_44712874的博客

06-20

713

VUE3的项目运行npm run serve报错

vue脚手架安装报错解决方案

weixin_44279243的博客

09-20

997

安装vue脚手架不成功的解决方案

为什么新建vue3脚手架只能用npm run serve不能用npm run dev

qq_44075328的博客

06-01

585

部分中定义对应的命令。因此，如果你使用 Vue CLI 3 创建了一个新项目，你应该使用。这是因为 Vue CLI 3 将开发和构建命令都封装在。需要注意的是，如果你想在项目中自定义开发和构建命令，可以在。命令来启动本地开发服务器。在 Vue CLI 3 中，新建的项目默认使用的是。命令中，而不是将它们分别作为 npm 脚本来定义。命令来启动本地开发服务器，并监视文件的更改。在这个配置中，"dev" 命令会运行。命令来启动本地开发服务器，而不是。命令来启动本地开发服务器，而不是。命令来启动本地开发服务器。

npm run serve失败但是有vue脚手架

05-15

如果你的vue脚手架已经安装成功，但是运行 `npm run serve` 失败了，可能是以下几个原因导致的： 1. 项目依赖未安装或者安装不完整，可以尝试运行 `npm install` 命令重新安装依赖； 2. 端口被占用，可以尝试修改 `...

npm run serve 与npm run dev区别

最新发布

08-29

`npm run serve` 和 `npm run dev` 都是前端开发中常用的命令，它们通常是构建工具如Webpack、Vue CLI等自定义的脚手架任务，用于启动本地开发服务器。两者的主要区别在于： 1. **命名约定**：`serve` 或 `dev` ...

没有npm run dev只有npm run serve

12-21

当项目中没有`npm run dev`命令，而只有`npm run serve`命令时，通常是因为项目使用的是Vue CLI脚手架进行开发。 `npm run serve`命令是Vue CLI提供的一个内置命令，用于在开发环境下启动一个本地服务器，并实时...

[vue3] error in ./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js

qubes的专栏

10-17

2288

question 使用vue-cli(4.5.13) create vue3(3.1.3) npm run server error error in ./node_modules/@vue/reactivity/dist/reactivity.esm-bundler.js solution1 办法1: 编辑配置文件vue.config.js 此办法不行 // vue.config.js module.exports = { transpileDependencies: ['@vue/reactivi

安装@vue/cli脚手架又又又出问题啦！！！

weixin_42349568的博客

11-17

557

昨天手贱把vue 脚手架删除了，然后就再也安装不上了，各种奇奇怪怪的报错，，，之前的解决办法： https://blog.csdn.net/weixin_42349568/article/details/108361782 但是今天统统失效，绝望之际，用windows自带的命令提示符，使用管理员权限打开：然后切换设置成淘宝镜像： npm config set registry https://registry.npm.taobao.org 最后， npm install -g @vue/cli

【Vue+Element】[ERROR] Could not resolve “@vue/reactivity“. You can mark the path “@vue/reactivity“...

HEX9CF的技术博客

10-21

2874

引入 Element Plus 后控制台报错，报错信息如下。查看命令行控制台，发现报错。

vue脚手架配置中出现的问题

weixin_44442634的博客

01-14

283

记录安装vue环境出现的问题： 1.使用npm正常安装，但事后输入vue不是批处理文件方法：用全局变量安装vue。（1）在node.js官网下载node.js，下载位置随意，但是要记住下载的路径；（2）下载的时候选择add to path；（3）在命令提示符中查看node和npm版本，若能查到，证明环境变量配置成功；（4）在node.js文件夹下用管理员账号新建node_cache和node_...

vue3运行npm run serve无反应，选择跳转后会自动跳入文件路径中

a2986467829的博客

09-13

1626

今天在学习vue3的时候遇到一个问题，就是执行npm run serve的时候没有任何提示直接结束，也不报错去浏览器输入本地8080端口也进不去。有点困扰，上网找了些答案都是运行报错给予的答案与我所遇到的格格不入，所以我就从文件看起，进到跳转的。文件地址，搜索发现这个npm文件是个空壳，然后他每次执行都会去Systeam.32中的这个方法，他会先执行npm这个空文件夹所以我把他删除了，就正常了。

vue-cli脚手架version2和3的使用及更新的问题解决

weixin_42661283的博客

08-16

6187

vue-cli2.+版本升级 vue-cli3.+版本首先卸载旧版本 npm uninstall vue-cli -g 安装新版本 npm i @vue/cli -g 包名称由 vue-cli 改成了 @vue/cli 安装更新之后，通过 vue -V 查看 vue-cli 安装的版本，如果版本没有发生变化，排除掉 npm 环境的问题，那么可能是因为缓存...

【Vue】脚手架的一些个介绍

Superman_H的博客

02-09

3466

# 脚手架 - 脚手架 Vue CLI：用于快速生成 Vue 项目 - 安装 Vue CLI：`npm i -g @vue/cli` - 查看 Vue CLI 版本：`vue -V` - 创建项目：① `vue create project-name`、 ② `cd XXX` 进入项目所在目录、 ③ `npm run serve` 运行项目 # 项目创建过程 1. `vue create vue-demo` 创建 Vue 项目 vue-demo 2. Please

vue3+ts项目运行过程中遇到的错误简记

橘子花会开

11-06

5114

vue3+t开发问题简记

如果遇到提示错误 reactivity.esm-bundler.js?a1e9:337 Set operation on key “default“ failed: target is readonl

weixin_43293835的博客

04-28

3567

async-validator控制台警告解决方案如下: 1.找到util.js node_modules -> async-validator -> es -> util.js 将console.warn(type, errors)注释 2.如果没找到util.js node_modules -> async-validator -> dist-node 与 dist-web -> index.js 将console.warn(type, errors)注释 ...