vue环境搭建及其可能遇到的问题汇总
2023-03-27 本文已影响0人
爱你为你做饭
- vue环境搭建
- node.js 安装或者升级用到的几个命令汇总：
npm cache clean -f： 清除node.js的cache
sudo npm install -g n： 使用npm安装n模块
npm view node versions ： node所有版本
sudo n latest : 升级到最新版本
sudo n stable : 升级到稳定版本
sudo n xx.xx : 升级到具体版本号
node -v: 查看node.js的版本号
- 运行常见vue项目的流程：
- cd切换到项目所在的目录
- 执行命令 npm install 用来加载项目的插件依赖
- 执行npm run dev/serve(命令结合json文件中配置的命令)启动服务，通过服务的访问链接可以访问vue项目。
- pm install安装插件用于墙的问题可能很慢或者卡顿此时解决方法通常下面两种：
- 升级node版本具体命令参考上面，不建议升级到最新版本，不稳定，我是从12升级到16.
- 可以将npm切换到淘宝镜像，不过需要注意的是淘宝镜像可能出现其他问题比如找不到对应的插件，反正来回试试吧！那个能用就用那个，切换npm命令如下：
npm config set registry https://registry.npmjs.org ：切回npm原有库
npm config set registry https://registry.npm.taobao.org：切回npm淘宝镜像
npm config get registry： 查看当前npm的库的地址
-
安装vue脚手架后，脚手架提供给vue的命令，vue的命令集合如下（没有几个且容易理解）：
vue命令
备注：全局安装vue cli的命令行：
npm/cnpm install @vue/cli-service -g 全局安装
npm update -g @vue/cli 更新插件
vue upgrade:
用法： upgrade [options] [plugin-name]
（试用）升级 Vue CLI 服务及插件
选项：
-t, --to <version> 升级 <plugin-name> 到指定的版本
-f, --from <version> 跳过本地版本检测，默认插件是从此处指定的版本升级上来
-r, --registry <url> 使用指定的 registry 地址安装依赖
--all 升级所有的插件
--next 检查插件新版本时，包括 alpha/beta/rc 版本在内
-h, --help 输出帮助内容
-
vue-cli-service 的命令如下（包括命令可以指定的参数）：
cli服务命令集合
启动服务命令
组建项目命令
- mac电脑安装npm module 权限问题（mac 阻止文件写入）
解决方式：修改写入文件权限（局部或者全局修改）具体参考下面
参考文章。 - vue脚手架安装pnpm 兼容pnpm的命令行格式
npm i -g pnpm: 安装pnpm包管理工具
备注：pnpm的版本号与node js的版本号一一对应才可以 若不对应pnpm命令不可用 需要针对node js升级。npm和pnpm 命令互不冲突。两者区别是pnpm的性能更高一些。
参考文章：
Vue安装及环境配置、开发工具
Vue命令行创建项目及其运行项目
npm run dev 报错：missing script:dev
mac报错: sh:vue-cli-service:command not found
sh: vue-cli-service: command not found
Error: Cannot find module ‘@vue/cli-plugin-babel‘
TypeError: Cannot read property 'upgrade' of undefined
npm install 的文件权限问题
