1.全局安装vue-cli

cnpm i vue-cli -g

2.监测安装版本

vue -V

 大写V : version

3.指定目录下新建项目

vue init webpack [项目名]

按自己的意愿配置、选择对应信息。最后配置完成检查package.json是否如此

4.进入到项目

cd demo

5.安装全部依赖(或者在init是选择自动安装)

cnpm i

6.安装你需要但是默认没被安装的(比如axios)

cnpm i --S vuex axios

(上图忘了cd到对应目录,自己安装一定要先cd到对应目录,不然在文件夹同级又多建一个package.json和node_modules)

备注: --S 大写,将安装到dependencies内

6.安装成功执行运行

cnpm run dev

这里,默认配置的端口为8080(后期可以自己改),现在可以在浏览器打开http://localhost:8080,如下图说明成功

vue工具 - vue-cli安装使用流程的更多相关文章

  1. vue工具 - vue/cli@3.xx 安装使用流程

    mac安装记得npm前边加sudo 安装脚手架,用于生成目录 npm install -g @vue/cli 安装用于编译单个的.vue文件 npm install -g @vue/cli-servi ...

  2. Vue技术点整理-Vue CLI安装详解

     一,脚手架安装 Node 版本要求 Vue CLI 需要 Node.js +).你可以使用 nvm 或 nvm-windows 在同一台电脑中管理多个 Node 版本. 1,全局安装Vue CLI ...

  3. 01 . Vue简介,原理,环境安装

    简介 vue是一个JavaMVVM库,是一套用于构建用户界面的渐进式框架,是初创项目的首选前端框架.它是以数据驱动和组件化的思想构建的,采用自底向上增量开发的设计.它是轻量级的,它有很多独立的功能或库 ...

  4. Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置

    Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置 这是上一篇对目录简单介绍: 关于编辑器,可以使用轻量级的 Sublime Text 3,我使用的是 HBuilder, 但 ...

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

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

  6. vue笔记 介绍及安装 一

    Vue.js 是什么 Vue (读音 /vjuː/,类似于 view) 是一套用于构建用户界面的渐进式框架.与其它大型框架不同的是,Vue 被设计为可以自底向上逐层应用.Vue 的核心库只关注视图层, ...

  7. 【vue】vue安装卡住/报错

    网上有很多教程怎么安装: 安装cnpmnpm install -g cnpm --registry=https://registry.npm.taobao.org 升级npmcnpm install ...

  8. Vue(3)- 安装脚手架、过滤器、生命周期的钩子函数、vue-router基本使用

    一.安装脚手架 1.下载node.js,本文下载版本为node-v8.12.0-x64.msi,一键式安装. 2.安装完成后,打开终端,输入node,可进入node环境(两次ctrl+c退出),如下图 ...

  9. vue(1)安装

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

  10. 【转】vue.js三种安装方式

    Vue.js(读音 /vjuː/, 类似于 view)是一个构建数据驱动的 web 界面的渐进式框架.Vue.js 的目标是通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件.它不仅易于上手 ...

随机推荐

  1. VS2013 此模板尝试加载组件程序集”NuGet.VisualStudio.interop,Version=1.0.0.0 的解决办法

    此模板尝试加载组件程序集 NuGet.VisualStudio.Interop   分析错误 既然错误信息提示模板尝试加载组件程序集,那说明NuGet.VisualStudio.Interop程序集不 ...

  2. Git 基础 - 远程仓库的使用

    远程仓库的使用 要参与任何一个 Git 项目的协作,必须要了解该如何管理远程仓库.远程仓库是指托管在网络上的项目仓库,可能会有好多个,其中有些你只能读,另外有些可以写.同他人协作开发某个项目时,需要管 ...

  3. Android检查设备是否可以访问互联网,判断Internet连接,测试网络请求,解析域名

    安卓SDK提供了ConnectivityManager类,那么我们就可以轻松的获取设备的网络状态以及联网方式等信息. 但是要想知道安卓设备连接的网络能不能访问到Internet,就要费一番周折了. 本 ...

  4. 简单理解AOP(面向切面编程)

    AOP为Aspect Oriented Programming的缩写,意为:面向切面编程,通过预编译方式和运行期动态代理实现程序功能的统一维护的一种技术. AOP与OOP是面向不同领域的两种设计思想. ...

  5. 【WP8】关于类库本地化问题

    WPToolkit中的ToggleSwitch开关控件是比较常用的控件,之前在做的的时候遇到一个问题,默认语言改为中文,手机系统语言也为中文,但是开关状态无法应用本地化的语言库,开关状态总是显示On/ ...

  6. JWT全面解读、使用步骤

    JWT全面解读JWT全面解读前言JWT基本使用在pom.xml引入java-jwt示例如下概念介绍JWT消息构成头部playload标准中注册的声明 (建议但不强制使用)自定义数据签名signatur ...

  7. js压缩上传图片base64长度

    im发送图片,现将图片压缩再上传 1) 调用 FileReader 的 reader.readAsDataURL(img); 方法, 在其onload事件中, 将用户选择的图片读入 Image对象. ...

  8. go搭建web服务

    https://github.com/astaxie/build-web-application-with-golang/blob/master/zh/preface.md

  9. 【hadoop】 hadoop 单机伪分布式安装

    准备: 虚拟机(CentOS 6.9) JDK1.8 hadoop2.8.0 一.JDK安装及配置 rpm -ivh jdkxxxx 安装 配置环境变量 vim /etc/profile export ...

  10. 一个基于jquery的智能提示控件intellSeach.js

    一.需求 我们经常会遇到[站内搜索]的需求,为了提高用户体验,我们希望能做到像百度那样的即时智能提示.例如:某公司人事管理系统,想搜索李XX,只要输入“李”,系统自然会提示一些姓李的员工,这样方便用户 ...