1.安装node

node官网安装地址
推荐安装稳定版本(LTS)以及安装路径为系统盘(C)

查看node安装成功否

注释:以下命令使用 命令提示符(管理员)权限,win10 对user权限的限制了访问权限。
node -v 查看node版本
npm -v 查看npm版本
where node 查看node安装位置

注意:node 版本号大于npm版本号,基于之前安装版本过低,后面会报错。

安装路径非系统盘(例D盘),出现用户目录丢失问题解决

上图标注的文件目录可能丢失,解决办法:
主动创建目录,更新npm配置为新建目录路径,例 D:\nodejs
npm config set prefix "D:\nodejs\node_global"
npm config set cache "D:\nodejs\node_cache"

npm 运行慢,配置国内淘宝镜像包

npm config set registry https://registry.npm.taobao.org
后续包安装命令 npm 即可改为 cnpm

2.配置node环境变量

我的电脑(属性)->高级系统设置->环境变量编辑-保存

编辑path环境变量,新增node安装路径


增加环境变量NODE_PATH 配置的内容为node_modules 路径

已经搭建好框架的项目直接跳转 步骤6 进行项目启动即可

3.安装VUE

npm install vue -g
-g是指安装到node_global全局目录去

4.安装Vue-cli

运行 npm install vue-cli -g
安装vue脚手架

5.webpack构建项目

命令行进入构建项目的路径 例:cd D:\vue-project
构建vue项目名 vue01
运行 vue init webpack vue01 构建项目并配置相关项

项目构建成功

6.项目启动

运行 npm install 下载项目依赖包
运行 npm run dev 本地启动

运行成功,在浏览器验证

浏览器验证成功,就此基本VUE目录框架搭建完成,开始模块开发了~~

7.灵活改变运行默认端口8080,避免端口冲突

8.项目打包

运行 npm run build 进行线上打包
打包项目代码,一般默认从src目录代码压缩混淆到dist目录下。

转载于:https://www.cnblogs.com/yaohe/p/10769880.html

Vue 环境搭建(win10)相关推荐

  1. Lua环境搭建 Win10

    Lua环境搭建 Win10 一.安装Lua 基于Mingw构建,需要安装好Mingw环境. 点此获取Lua Source Code.选择版本为 5.35, 解压缩,CMD/PS输入make mingw ...

  2. VUE环境搭建教程以及VSCODE插件Vetur和ESlint的安装配置

    *此教程适用于Windows环境下  Author:Sinclair  CreateDate:2018-10-09 1.安装node.js 下载地址:Download | Node.js (LTS代表 ...

  3. nodejs + vue环境搭建

    nodejs + vue环境搭建 安装nodejs 下载并安装[nodejs] 配置nodejs 安装cnpm(淘宝镜像) 安装vue vue vue-cil 测试,创建新项目 附上vue项目文件夹说 ...

  4. Django+Vue环境搭建

    一.Django环境 1.下载Django pip install django 2.创建Django项目 django-admin startproject server  #server  为项目 ...

  5. Vue环境搭建及入门

    初始Vue Vue环境搭建 Vue模板语法 Vue数据绑定 el-data的两种写法 MVVM模型 Vue数据代理 Vue中的事件处理 Vue官网:https://cn.vuejs.org 初始Vue ...

  6. Vue 环境搭建和 Hello world

    文章目录 vue环境搭建 引入vue 安装vue开发者工具 全局配置 Hello world 404报错处理 Hello world 一些分析 总结 尚硅谷Vue2.0+Vue3.0全套教程丨vuej ...

  7. Vue环境搭建(node安装,环境配置,运行项目)

    Vue环境搭建(node安装,环境配置,运行项目) 一.安装node 1.去官网下载node之后,推荐安装稳定版本(LTS)node官网下载地址 2.查看node安装成功否 node -v 查看nod ...

  8. java 环境搭建win10

    java 环境搭建win10 首先下载 地址 1.8 11 版本都有https://www.oracle.com/technetwork/cn/java/javase/downloads/index. ...

  9. GAMES101课程环境搭建(Win10+VSCode)

    GAMES101课程环境搭建(Win10+VSCode) 抄自:知乎 发现很多人遇到Mingw环境的问题,这里共享一个可用的mingw,自行解压,然后把bin目录加入环境变量即可. 链接: https ...

  10. vue脚手架搭建配置试调地址和端口号_全栈的自我修养: 002使用@vue/cli进行vue环境搭建 (使用Vue,SpringBoot,Flask完成前后端分离)...

    全栈的自我修养: 使用@vue/cli进行vue.js环境搭建 Success, real success, is being willing to do the things that other ...

最新文章

  1. kcachegrind安装
  2. 交通图网络太大太复杂,没法处理?DMVST-Net巧妙处理
  3. ASP.NET操作Word文档(转)
  4. sqlmap自动扫描注入点_SQLmap JSON 格式的数据注入
  5. php中使用like查询,php like 查询
  6. 一个工作了两三年程序员的学习计划
  7. jQuery.fn.extend 与 jQuery.extend 用法
  8. 检测React组件外部的点击
  9. MIMO-OTFS in High-Doppler Fading Channels:Signal Detection and Channel Estimation(3)
  10. 桌面下雪软件测试工程师,桌面下雪
  11. 计算机开机提示dll,电脑开机提示找不到iertutil.dll的解决妙招
  12. win10 两台电脑之间共享桌面及共享文件(手把手教学)
  13. 中兴路由器查看时间_中兴路由器的设置方法教程
  14. 应用MIME将ZPT内容输出为excel文件(word文件)
  15. Java学习记录——错题总结(十五)
  16. Eclipse插件配置
  17. 朋友问我c++学到哪了 加愤怒的小鸟 要看到最后
  18. 四旋翼自主飞行器探测跟踪系统项目的随笔
  19. 解决Mac下窗口无法最大化的问题 - 只有最小化和全屏怎么够
  20. c语言教学系统管理,在Moodle平台中实现_C语言_课程教学管理系统

热门文章

  1. java foreach 循环原理
  2. 浅析正则表达式模式匹配的 String 方法
  3. 基于ipfire的open***功能--client to net (Roadwarrior)配置(一)
  4. OpenGL渲染流水中的处理步骤
  5. Windows Server 2008正式版[微软官方下载地址+官方语言包]
  6. Python基础06-数据类型:元组tuple
  7. linux内核 semaphore,2.4内核里semaphore源码的一个疑问
  8. 什么是导师负责制_为什么一个导师是不够的
  9. 如何评判软件测试培训机构的好坏?
  10. 专业的java培训机构是否靠谱,对比一下就知道了!