如何在电脑上配置Vue开发环境

一,开发环境 :

  • Node JS(npm)
  • Visual Studio Code(前端IDE)

  • 安装NodeJS 下载地址: nodejs中文网

  • Visual Studio Code 官网下载地址 https://code.visualstudio.com/
  • 官网文档:https://code.visualstudio.com/docs
  • 简书教程:https://www.jianshu.com/p/990b19834896

二,如何安装NodeJS :

  • 到官网下载自己系统对应的版本
  • 下载完成后解压 把Node添加到系统环境变量里面
  • 打开cmd命令行 :输入node -v,验证node安装;输入npm -v,验证node包
  • 管理器npm的安装 升级npm sudo npm install npm -g #linux系统npm install npm -g # windows系统

三,npm使用淘宝镜像 :

  • npm 使用的是国外中央仓库,下载速度非常不乐观
  • 像 Maven 有国内镜像一样,npm 在国内也有镜像可用 强烈建议使用淘宝镜像,命令行执行命令 npm install -g cnpm –registry=https://registry.npm.taobao.org
  • 安装成功后 用 cnpm 替代 npm 命令即可

四,安装 Yarn替代npm

  • Yarn是Facebook发布的node.js包管理器,比npm更快、更高效,可以使用其替代npm
  • 安装Yarn,命令行执行:
  • npm i yarn -g –verbose
  • 切换Yarn资源地址为淘宝镜像,命令行执行
  • yarn config set registry https://registry.npm.taobao.org
  • Yarn跟npm命令关系
  • npm install => yarn install
  • npm install –save [package] => yarn add [package]
  • npm install –save-dev [package] => yarn add [package] –dev
  • npm install –global [package] => yarn global add [package]
  • npm uninstall –save [package] => yarn remove [package]
  • npm uninstall –save-dev [package] => yarn remove [package]

五,下载各种工具 :

  • 安装打包工具 webpack,-g 表示全局安装
  • npm install webpack -g
  • 安装 vue 脚手架项目初始化工具vue-cli
  • npm install vue-cli -g

六,创建项目

  • 设置工作区,新建文件夹即可(不能有中文目录)
  • 创建项目
  • vue init webpack
  • 进入到项目根目录
  • cd
  • 安装依赖包
  • yarn install #最快
  • npm install
  • cnpm install
  • 运行项目
  • npm run dev
  • 浏览器访问 http://localhost:8080

进入主界面就证明成功啦

posted @
2021-09-26 12:24 山有扶苏QWQ

阅读(
293

) 评论(
) 编辑

Original: https://www.cnblogs.com/blogof-fusu/p/15337522.html
Author: 山有扶苏QWQ
Title: 如何在电脑上配置Vue开发环境

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/598834/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球