vue框架项目-前期准备阶段踩坑（一）

最新推荐文章于 2023-11-03 10:37:25 发布

前端小桃

最新推荐文章于 2023-11-03 10:37:25 发布

阅读量1.9k

点赞数 1

分类专栏： vue项目踩坑文章标签： vue.js

本文链接：https://blog.youkuaiyun.com/megamind0430/article/details/108347669

版权

vue项目踩坑专栏收录该内容

4 篇文章

订阅专栏

本文记录了在Vue项目中遇到的一些问题及其解决方案，包括将npm run serve改为dev，处理请求失败，解决electron安装卡住的问题，更新electron版本，重命名以用户名命名的文件夹，以及处理vue项目启动时的npm ERR!代码问题。通过这些步骤，可以更好地理解和解决Vue项目开发中常见的配置和错误。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

1.如何将npm run serve改成dev
在package.json中寻找到到“script：”，
将"serve": "vue-cli-service serve",改成"dev"：

2.请求失败，浏览器network请求变为红色
先是到谷歌浏览器F12开发者工具里查看请求的请求地址是否正确，与同事沟通发现是错误的，在vscode中全局搜索错误的地址路径，最终找到‘.env.development’文件，将旧地址注释掉，改成正确地址，解决问题。

3.解决安装electron卡在node install.js 不动问题
起因是想要更新electron的版本，以便使用electron-bulider的时候不出错，原先版本太低了，是v1.x.x，electron的更新只能是从当前版本的最新版，比如v1.0.2升到v1.9.2，跨版本更新就需要删了重新下载，比如v1.0.2升到v9.0.1，这一删，就进坑了。

安装时卡死在这

> electron@6.1.7 postinstall C:\Users\taotao\AppData\Roaming\npm\node_modules\electron
> node install.js

查了解决方法，很多是让找到~/.npmrc 文件，加入如下代码

registry=https://registry.npm.taobao.org
electron_mirror="https://npm.taobao.org/mirrors/electron/"

但是我确实是没找到这个文件，终于找到了第二种解决方法，不去改文件，直接在powershell中用代码修改，然后就可以成功下载了。

npm config set electron_mirror https://npm.taobao.org/mirrors/electron/

出现这个问题的原因是：

install.js里面的下载是依赖于electron-download这个模块

4.更新electron-vue构建的项目中electron版本
[https://blog.youkuaiyun.com/weixin_43272648/article/details/104339699]
5.将以用户名命名的文件夹改名字
如：“/Users/桃子”改成“/Users/taotao”,大部分推荐修改注册表，但是我改了注册表，该改的环境变量也改了，运行项目时依然会存在原路径，最后找到了一个流程，亲测有效！！
首先修改注册表：

1.Win+R打开命令窗口后输入regedit、打开系统的注册表、ctrl+f搜索，找到ProfileList，在这里有几个S-1-5-开头的项，每个都点开看看，找到包含ProfileImagePath项并且值为C:\Users\桃子的，找到之后再将ProfileImagePath双击，将桃子改为 taotao ,确定后关闭注册表编辑器。
2.此时去C:\Users 是不能修改文件夹名称的。直接重启电脑，重启电脑以后桌面会变成第一次使用电脑的样子，不要担心，去C:\Users 把桃子这个文件夹重命名为taotao 然后直接重启电脑。重启以后就会变回原来的样子

此时还需要进行一步，

在 C:\Users 文件夹下面创建一个快捷方式。进入C:\Windows\System32 ,找到cmd.exe
右键以管理员身份运行，然后执行命令 mklink /j C:\Users\桃子 C:\Users\taotao 然后就ok了。

在这里插入图片描述

6.初始问题：运行vue项目时，显示如下问题 npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! vue@0.1.0 serve: `vue-cli-service

想运行项目，结果报错了：

npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! vue@0.1.0 serve: vue-cli-service serve
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the vue-sell@0.1.0 serve script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

解决此问题，先尝试将文件中的node_modules文件删除，然后重新在项目目录下npm install，如果不好用的话，可以尝试更改nodejs的版本，

——于是，，，我开始尝试第一个，遇到的第一个坑如下。

①.node_modules 删除的时候提示没有权限

node_modules有时候需要重新npm，都懂得，所以偶尔会遇到提示需要权限才能删除，此时，把vscode等关联到这个文件夹的所有软件都关闭，然后再去删除，就OK了！

——but，，，这个方法试过时候没什么用，还是会报错，我开始尝试第二个，更改nodejs的版本。

②.升级nodejs版本安装n模块报错 npm ERR! notsup Unsupported platform

出现

npm ERR! notsup Unsupported platform for n@2.1.8: wanted
{“os”:"!win32",“arch”:“any”} (current: {“os”:“win32”,“arch”:“x64”})

想升级nodejs版本，但是报错不让下载n模块，怎么办？

在命令后面加上 --force重新运行：$ npm install -g n --force

③.n模块安装完成，使用时会报错

Git BASH (MSYS) is not supported by n
  Error: no version found for 'stable'

此时，事情变得严重，查资料发现，windows根本不支持n模块，这就尴尬了，只能到官网下载最新版，然后安装。官方网站
注意，这里查询一下情况变量，覆盖安装到之前的路径。
详细步调为：
我的电脑–右键–属性–高级系统设置–环境变量–系统变量–PATH
然后查询path 找到nodejs的路径，安装的时间选中这路径覆盖安装即可。