全局安装vue-cli

命令行输入:

vue-cli版本在3以下

npm install --global vue-cli

安装vue-cli后,可以查看一下是否安装成功vue --version,

电脑上已经安装过vue-cli的话,省去上述步骤,开始建立项目

假设想把项目建立在D盘

输入:d:

回车

建立一个基于webpack模板的项目工程,项目名vueproject1(项目名自定义)

vue init webpack vueproject1

注意:项目名称不能包含大写字母

建立项目工程之后

接下来基本都回车

装好后,启动项目
cd vueproject1 // 进入到项目根目录

npm run dev// 启动项目

该项目在端口:http://localhost:8080上运行

在浏览器中输入:http://localhost:8080

具体教程参考:https://www.imooc.com/video/16985

项目运行过程中不要关闭命令行工具

vue-cli2.x版本安装vue-cli建项目的更多相关文章

  1. Vue脚手架最新版本安装使用

    现在很多的插件如Vant 这类的样式框架,都去兼容了Vue的3.0版本,所以我总结一下如何去简单的搭建一个Vue3.0的框架 开始 一,如何安装 在这里说明一下,Vue脚手架版本,和Vue版本是两个东 ...

  2. VUE知识day3_vue-cli脚手架安装和webpack模板项目生成

    ue-cli 是一个官方发布 vue.js 项目脚手架,使用 vue-cli 可以快速创建 vue 项目. GitHub地址是:https://github.com/vuejs/vue-cli 一.安 ...

  3. 【vue】chrome已安装Vue Devtools在控制台却无显示

    chrome已安装Vue Devtools在控制台却无显示的解决: 在点亮Vue Devtools图标后,控制台没有vue解读显示. 原因:脚手架配置NODE_ENV直接定义为了production版 ...

  4. (原)Vue 单文件组件安装 (创建vue-cli 项目)

    更新于20200220 题外话:久违了我的博客园 正题: 1.准备工作,安装环境 1.安装node 官网下载安装即可  -- 配置环境变量 2.安装npm (基于node.js 包管理器) 3.安装c ...

  5. win10 安装vue 详解-包括node.js、npm、webpack

    1.下载 去官网下载 node.js https://nodejs.org/en/download/ 一般不会选择最新的,我安装的是 12.18.4 进入历史记录页面网址 https://nodejs ...

  6. vue(1)安装

    1.安装node.js(https://nodejs.org/en/),我安装的是 v10.15.1 1).在nodejs安装路径下,新建node_global和node_cache两个文件夹 2). ...

  7. MAC安装vue.js

    一.下载node node下载地址:https://nodejs.org/en/download/ 下载后点击安装即可. node -v 检查安装是否成功 二.安装 淘宝镜像 (npm) npm in ...

  8. vue自学入门-4(vue slot)

    vue自学入门-1(Windows下搭建vue环境) vue自学入门-2(vue创建项目) vue自学入门-3(vue第一个例子) vue自学入门-4(vue slot) vue自学入门-5(vuex ...

  9. vue/cli新旧版本安装方式

    一.老版本安装  Shift+鼠标右键 选择打开命令窗口 1.创建项目之前,需先确保本机已经安装node 在命令窗口中执行node -v npm -v 2.一般情况下用npm安装东西比较慢,可以使用淘 ...

  10. 运行vue项目--安装vue脚手架vue cli

    第一步. 安装node: 官网下载node的.pkg,下载地址,选择相应版本进行下载 mac终端下输入npm -v 和 node -v, 出现相应版本号即安装成功. 若均提示 command not ...

随机推荐

  1. float在内存中如何存储?

    float为浮点型,32位机器中占4字节共32bit,下标0-31. 31 位:符号位,正数为0,负数为1. 30 位:方向位.小数点左移位1,右移为0. 23-29:共7位,指数位.=指数-1. 0 ...

  2. Pc贪吃蛇

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. Vasya and Beautiful Arrays CodeForces - 354C (数论,枚举)

    Vasya and Beautiful Arrays CodeForces - 354C Vasya's got a birthday coming up and his mom decided to ...

  4. 如何让Python2与Python3共存

    一.摘要 最近做服务测试的时候,实在被第三方模块折磨的够呛,从安装就存在兼容Py2和Py3的问题,产品提供的服务越来越多,做服务验证也不得不跟进支持测试,这眼前的Hadoop/Hive/Hbase/H ...

  5. Linux文件系统之目录清单

    挂载点:挂载:将设备关联到当前文件系统目录 文件系统:rootfs:根文件系统/boot:系统启动相关文件,如内核.initrd.以及grub(bootleader:引导加载器)/dev:设备文件,  ...

  6. Elasticsearch:运用scroll接口对大量数据实现更好的分页

    在Elasticsearch中,我们可以通过size和from来对我们的结果来进行分页.但是对于数据量很大的索引,这是有效的吗?Scroll API可用于从单个搜索请求中检索大量结果(甚至所有结果), ...

  7. [译] 优化 WEBPACK 以更快地构建 REACT

    原文地址:OPTIMIZING WEBPACK FOR FASTER REACT BUILDS 原文作者:Jonathan Rowny 译文出自:掘金翻译计划 本文永久链接:https://githu ...

  8. springboot中使用spring security,登录url就出现403错误

    参考链接:https://segmentfault.com/q/1010000012743613 有两个controller,一个是所有用户可以访问的@RequestMapping("use ...

  9. 隐藏IDEA project 中的指定文件

    例如隐藏project下的.idea文件目录,以及.iml文件 在 Settings>File Types > ignore files and folders 中添加    .idea; ...

  10. Luogu P4141 消失之物 背包 分治

    题意:给出$n$个物品的体积和最大背包容量$m$,求去掉一个物品$i$后,装满体积为$w\in [1,m]$背包的方案数. 有 N 个物品, 体积分别是 W1, W2, …, WN. 由于她的疏忽, ...