一、安装node

1-  点击这里进入node官网下载

2-

3- 下载完成是这样的

4-  双击打开进行安装,一路next,安装完成是这样

5-  打开cmd进入安装node的文件夹,输入node –v,回车,出现版本号说明node安装成功

二、vue-cli的安装

进入cmd找到刚才安装node的文件夹,输入npm install –g vue-cli安装vue-cli,此时安装的vue是2.x版本,如需安装3.x版本需先卸载2.x(通过npm uninstall vue-cli –g),再通过npm install –g @vue/cli安装vue3.x,如下图所示安装的vue2.x(详情请参考vue官网https://cli.vuejs.org/zh/guide/installation.html

然后输入vue –V能看到版本号说明vue-cli安装成功

三、vue项目的构建

在你的vue项目文件夹下创建一个名称为vue-demo的项目,找到该文件夹输入vue init webpack vue-demo,如下图所示

等待项目构建完成。。。

项目构建完成,执行npm install

然后执行npm run dev,打开项目

出现这个界面,说明你的vue项目成功创建

接下来,进入浏览器输入http://localhost:8080,就成功打开了,你所创建的vue项目,关闭该vue项目只需在cmd中按下ctrl+c,选择y即可关闭,这次分享就到此为止了。

勤学苦练,方能成才,祝你项目顺利!!!

Vue项目开发前的准备工作,node的安装,vue-cli的安装的更多相关文章

  1. vue项目开发前的es6的知识储备

    let命令 学习笔记 1.let所声明的变量,只在let命令所在的代码块内有效. 2.不存在变量提升:所声明的变量一定要在声明后使用,否则报错. 一定要先声明,再去使用.let x=x;这样就是错误的 ...

  2. 基于vue模块化开发后台系统——准备工作

    文章目录如下:项目效果预览地址项目开源代码基于vue模块化开发后台系统--准备工作基于vue模块化开发后台系统--构建项目基于vue模块化开发后台系统--权限控制 前言 本文章是以学习为主,练习一下v ...

  3. Vue项目开发相关问题总结

    Vue项目开发相关问题总结 一.创建一个项目(两种方式) 1.通过CLI命令行创建,具体步骤如下: (1)Node 版本要求 Vue CLI 需要 Node.js 8.9 或更高版本 (推荐 8.11 ...

  4. Vue项目开发最新、最全代码规范文档

    Vue项目开发最新.最全代码规范文档 2019年02月21日 10:43:49 yw00yw 阅读数 337   一. 目录结构 |— build 构建脚本目录 |— build.js 生产环境构建( ...

  5. Vue 项目开发

    目录 Vue 项目开发 项目目录结构解析 入口文件 main.js (项目入口) 根组件 app.vue index.html 文件入口 router 路由 components 子组件 项目初始化 ...

  6. 【Silverlight】Bing Maps学习系列(一):开发前的准备工作

    [Silverlight]Bing Maps学习系列(一):开发前的准备工作 微软推出的Bing Maps地图引擎,对外开放了Silverlight和Ajax两种客户端API,同时微软针对全球地图还推 ...

  7. java项目开发的一些准备工作

    做项目有一段时间了,每次接手一个新项目都要在开发前做些准备工作,方便开发. 有些东西在配置的时候经常会忘记,所有整理一份,方便以后查阅! 1.安装JDK及搭建环境,安装tomcat及搭建环境,这些一般 ...

  8. vue项目开发时怎么解决跨域

    vue项目中,前端与后台进行数据请求或者提交的时候,如果后台没有设置跨域,前端本地调试代码的时候就会报“No 'Access-Control-Allow-Origin' header is prese ...

  9. vue项目开发中遇到的几个问题

    1.使用elment或者mintUI库时,需要全局引入ui库的css文件:然后在修改自己样式时,需要将自己的css文件引入到main.js中才会生效,全局引用2.使用v-html展示dom字符串时,相 ...

随机推荐

  1. python 1 默写用递归实现无限极分类 2 默写用树实现无限极分类

    data=[ {"cat_id":3,"name":"沙河","parent_id":1}, {"cat_id ...

  2. 挑战编程 uva100 3n+1

    挑战编程 刘汝佳 的第一道习题  热身题 熟悉下提交格式 题意 #include <iostream> #include <algorithm> using namespace ...

  3. Go 循环 (for)

    循环类型 for: for a := 0; a < 10; a ++{ fmt.Println(a) } 在执行结束后 a == 10 while: a := 0 for a < 10{ ...

  4. mysql关联两张表时的编码问题

    Mysql关联两张表时,产生错误提示Illegal mix of collations 1.先用工具把数据库.两张表的编码方式改变 2.这步很重要,需要改变字段的编码方式. ALTER TABLE ` ...

  5. mathematica练习程序(曲线的曲率与挠率)

    曲线的曲率k表示曲线的弯曲程度. 计算公式: 曲线的挠率tao表示曲率平面的扭曲程度,平面曲线挠率为0. 计算公式: 这里r代表曲线方程,比如有如下曲线方程:r={a*cos(t),a*sin(t), ...

  6. 前端 web mime类型引起的 常见404错误

    mime 类型设置参考https://www.w3school.com.cn/media/media_mimeref.asp

  7. java之获取变量的类型

    java要获取变量的类型必须自己定义一个函数: public class Test{ public static void main(String[] args) { short a = 1; a + ...

  8. golang--海量用户即使通讯系统

    功能需求: 用户注册 用户登录 显示在线用户列表 群聊 点对点聊天 离线留言

  9. ROS kinetic + Realsens D435i + ORK + LINEMOD 物体识别

    1. ORK 网址:https://wg-perception.github.io/object_recognition_core/ ORK (Object Recognition Kitchen) ...

  10. 【Notepad++】notepad++主题和字体设置(非常好看舒服的)

    #效果图 1.字体:Courier New 字号:14号字体 2.字体:Consolas 字号:14号字体 #设置方法 1.设置---语言格式设置 2.选择主题,同时勾选“使用全局字体”“使用全局字体 ...