Vue-cli4脚手架搭建
一:要安装Node.js:安装路径要默认安装(node-v12.16.2-x64.msi-长支持
二:要安装cnpm
1)说明:npm(node package manager)是nodejs的包管理器,用于node插件管理(包括安装、卸载、管理依赖等);
2)使用npm安装插件:命令提示符执行npm install <name>
3)选装cnpm因为npm安装插件时从国外服务器下载,受网络影响大,可能出现异常,如果npm服务器在中国就好了,所以淘宝团队干了这事。来自官网“这是一个完整的npmjs.org镜像,你可以用此代替官方van本(只读),同步频率目前为10分钟一次以保证尽量与官方服务同步。”
安装:npm install -g cnpm --registry=https://registry.npm.taobao.org
输入 cnpm -v,可以查看当前cnpm版本
yam是个包管理器,是facebook发布的一款取代npm的包管理工具安装yam
npm install -g yam
三:安装vue-cli脚手架构建工具
vue-cli 提供一个官方命令行工具,可用与快速搭建代行单页应用
1、先确认是否有安装过vue-cli
vue -V //如果有的话,就用下面的命令卸载
npm uinstall vue-cli -g (如图一所示)

2、安装vue-cli脚手架输入命令:cnpm install -g @vue/cli(如图二)

3、查看vue版本 :vue -V(如图三)

指定版本安装vue3.0以下:npm install -g vue-cli@版本号
vue3.0或vue3.0以上:npm install -g @vue/cli@版本号
四、创建项目
1输入如下命令:vue create vue-demo

default(babel,eslint)默认
Manually select features 手动选择

空格选择对应的插件




在cmd窗体中输入 cd vue-demo

在cmd窗体中在输入yarn serve

到这里也就完整的把vue-cli4脚手架搭建好了,打开ie浏览器输入http://localhost:8080(如下图)

Vue-cli4脚手架搭建的更多相关文章
- 使用Vue CLI脚手架搭建vue项目
本次是使用@vue/cli 3.11.0版本搭建的vue项目 1. 首先确保自己的电脑上的Node.js的版本是8.9版本或者以上 2. 全局安装vue/cli npm install @vue/cl ...
- 用 vue cli 脚手架搭建单页面 Vue 应用(进阶2)
1.配置 Node 环境. 自行百度吧. 安装好了之后,打开 cmd .运行 node -v .显示版本号,就是安装成功了. 注:不要安装8.0.0以上的版本,和 vue-cli 不兼容. 我使用的 ...
- vue+webpack4 脚手架搭建
1, vue 中 h => h(App) 的含义: //render: h => h(App) 是下面内容的缩写: render: function (createElement) { r ...
- 13. Vue CLI脚手架
一. Vue CLI 介绍 1. 什么是Vue CLI? Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.Vue CLI 致力于将 Vue 生态中的工具基础标准化.它确保了各种构建工 ...
- 让vue-cli脚手架搭建的项目可以处理vue文件中postcss语法
图中&属于postcss的语法,这样书写样式可以清楚的看出选择器之前的层级关系,非常好用. 在利用vue-cli脚手架搭建的项目中如果不配置是不支持这种写法的,这样写不会报错,但是样式不生效. ...
- 用vue-cli脚手架搭建一个仿网易云音乐的全家桶vue项目
一,vue-cli环境搭建 1,全局安装webpack npm install webpack -g 2,安装vue脚手架 npm install vue-cli -g 3,新建一个新的project ...
- vue脚手架搭建流程
搭建vue项目之前你需要安装vue的脚手架和node.js,一起去看看怎么搭建一个vue环境吧.(学编程语言最爱看见的就是用这个先写一个helloworld,只想说我对世界友好可是现实是残酷的.... ...
- 从0开始搭建vue+webpack脚手架(三)
在从0开始搭建vue+webpack脚手架(二)中已经基本完成了开发环境的配置.当开发完成后,我们需要将完成的项目进行打包,接下来对打包做一些优化: 运行 $ npm run build 可生成dis ...
- 从0开始搭建vue+webpack脚手架(二)
接着从0开始搭建vue+webpack脚手架(一) 三.配置webpack-dev-server 1. webpack-dev-server自带一个node的服务器, 项目在服务端运行的同时可以实现热 ...
- 脚手架搭建vue框架
一. node安装 1)如果不确定自己是否安装了node,可以在命令行工具内执行: node -v (检查一下 版本): 2)如果 执行结果显示: xx 不是内部命令,说明你还没有安装node , ...
随机推荐
- NKOJ4330 逛公园
时间限制 : - MS 空间限制 : 565536 KB 评测说明 : 3s 问题描述 策策同学特别喜欢逛公园.公园可以看成一张N个点M条边构成的有向图,且没有 自环和重边.其中1号点是公园的入 ...
- 《Three.js 入门指南》2- 照相机
2.1 什么是照相机 我们使用Three.js创建的场景是三维的,而通常情况下显示屏是二维的,那么三维的场景如何显示到二维的显示屏上呢?照相机就是这样一个抽象,它定义了三维空间到二维屏幕的投影方式,用 ...
- VS2019中QT连接及使用
23:27:43 2019-08-09 qt连接VS 连接前提是在下载qt的时候将 MSVC 2017装上 点击扩展 选择管理扩展 搜索qt 选择下载 之后下载结束并重新打开后 会弹出一个 QT o ...
- 使用Putty登录亚马逊云主机
亚马逊云主机配置之后会提示 提供一个 pem证书, 打开 SSH 客户端.(了解操作方法 使用 PuTTY 连接) 找到您的私有密钥文件(test001.pem).向导会自动检测您用于启动实例的密钥. ...
- Spring(三):bean的自动装配
Bean的自动装配 自动装配是Spring满足bean依赖的一种方式. Spring会在上下文中自动寻找,并自动给bean装配属性 Spring中三种装配方式 在xml中显式的配置. 在java中显式 ...
- JAVA自动化之Junit单元测试框架详解
一.JUnit概述&配置 1.Junit是什么? Junit是一个Java 编程语言的开源测试框架,用于编写和运行测试.官网 地址:https://junit.org/junit4/ 2.Ma ...
- 廖雪峰 Git 教程 + Git-Cheat-Sheet 学习总结
廖雪峰 Git 教程 + Git-Cheat-Sheet 学习总结 本教程主要是个人的 Git 学习总结. 主要参考博客: 廖雪峰 Git 教程 Git-Cheat-Sheet 文章目录 廖雪峰 Gi ...
- C语言实现链式队列
链式队列,简称"链队列",即使用链表实现的队列存储结构. 链式队列的实现思想同顺序队列类似,只需创建两个指针(命名为 top 和 rear)分别指向链表中队列的队头元素和队尾元素, ...
- Markdown自动生成目录
Markdown自动生成目录 使用npm语法生成 1.安装npm 2.安装doctoc插件 3.执行生成 参考 Markdown自动生成目录 使用npm语法生成 1.安装npm 我的系统是deepin ...
- 反射----获取class对象的五种方法
反射Reflection 配合注解使用会格外强大,反射注解,天生一对 类如何加载? 动态语言和静态语言.我知道是什么,不用总结了. 由于反射,Java可以称为准动态语言. 允许通过反射获得类的全部信息 ...