VUE CLI 3.0 安装及创建项目
一、安装
VUE CLI 3.0 官网: https://cli.vuejs.org/ 详细资料可以自己先把官网过一遍。
1. 安装(默认你的电脑上已安装node及npm)
npm install -g @vue/cli
2. 检查版本
vue --version
二、创建项目 (用的cmd工具)
1. 利用 cd 指令进入到指定目录,即你的项目想放在哪个地方就进入到哪个目录里面
2. 创建项目,通过指令: vue create projectname (说明: projectname 为你的项目名称,必须小写字母)
3. 选择项目配置,配置会有3个选项:
a. 常用预设 normal-preset
b. 默认 default
c. 手动选择 manually select features
根据自己的个人情况进行选择,我通常选择的 normal-preset。接下来就是自动安装,安装成功后会提示你进入到项目目录,并运行程序,如下:

到此项目就创建完了,进入到项目目录后,可以通过 npm run serve 运行看下,效果如下图:

编译成功后,在浏览器输入 http://localhost:8080/ 查看效果

三、创建后的目录结构如下(用的vscode编辑器)

VUE CLI 3.0 安装及创建项目的更多相关文章
- vue-cli 3.0 安装和创建项目流程
使用前我们先了解下3.0较2.0有哪些区别 一.3.0 新加入了 TypeScript 以及 PWA 的支持二.部分命令发生了变化: 1.下载安装 npm install -g vue@cli 2. ...
- 【Vue CLI】从安装到构建项目再到目录结构的说明
目录 1. 构建我们的项目 2. 目录结构说明 2.1 build目录 2.2 config目录 2.3 src目录 2.4 static目录 "Vue CLI是一个基于Vue.js进行快速 ...
- cocos2d-x 3.0 安装及创建项目
版权声明:本文为博主原创文章,未经博主同意不得转载. https://blog.csdn.net/LanerGaming/article/details/24146921 好久没实用过cocos2d- ...
- 如何使用@vue/cli 3.0在npm上创建,发布和使用你自己的Vue.js组件库
译者按: 你可能npm人家的包过成千上万次,但你是否有创建,发布和使用过自己的npm包? 原文: How to create, publish and use your own VueJS Compo ...
- vue安装及创建项目的几种方式
原文地址:https://www.wjcms.net/archives/vue安装及创建项目的几种方式 VUE安装的方式 直接用 script标签 引入 对于制作原型或学习,你可以这样使用最新版本: ...
- vue/cli 3.0脚手架搭建
在vue 2.9.6中,搭建vue-cli脚手架的流程是这样的: 首先 全局安装vue-cli,在cmd中输入命令: npm install --global vue-cli 安装成功: 安装完成 ...
- Vue CLI 3.0脚手架如何在本地配置mock数据
前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...
- Webpack指南(一):安装,创建项目,配置文件,开发环境以及问题汇总
Webpack是一个现代 JavaScript 应用程序的静态模块打包器(module bundler).当 webpack 处理应用程序时,它会递归地构建一个依赖关系图(dependency gra ...
- 专访Vue作者尤雨溪:Vue CLI 3.0重构的原因
1.为什么要对 Vue CLI 进行大规模修改? 尤雨溪认为旧版本的 Vue CLI 本质上只是从 GitHub 拉取模版,这种拉模版的方式有几个问题: (1) 在单个模版里面同时支持太多选项会导致模 ...
随机推荐
- Linux源码编译安装程序
一.程序的组成部分 Linux下程序大都是由以下几部分组成: 二进制文件:也就是可以运行的程序文件 库文件:就是通常我们见到的lib目录下的文件 配置文件:这个不必多说,都知道 帮助文档:通常是我们在 ...
- shell if 条件判断
condition='123' if [ -z condition]; then echo "condition 是空的" fi 字符串判断: = 两个字符串相等. != 两个字符 ...
- MySQL:事务的隔离性
[参考文章]:数据库的事务特性及隔离级别 1. 事务的四大特性 1.1 原子性(Atomicity) 原子性是指事务包含的所有操作要么全部成功,要么全部失败回滚,因此事务的操作如果成功就必须要完全应用 ...
- ubuntu 16.04 下更换boost版本
如果是新机器,没装过boost,那么直接一条命令 sudo apt-get install libboost-all-dev 头文件一般安装在 /usr/include 下面有一个目录boost,里面 ...
- 使用pipenv隔离不同项目的依赖包
pipenv可以为不同的路径创建python环境和依赖包,结合pyenv可以达到为不同项目使用不同python版本,不同依赖包的目的. pip install pipenv #安装pipenv 使用p ...
- SQL求出优秀、及格人数
首先看看班级的表的数据: 接下来,由于班级有分linux .Mysql.Java三门科目,因此,先求Linux科目的及格人数.不及格人数和优秀人数 做一个语句的分解: 1.首先查出每个班级的班级ID ...
- python之函数参数问题(参数为可变对象)
今天看到一段代码,其中函数入参有一个参数为list,类似如下: def linux_monitor(pid=0,pidlist = []): pidlist.append(pid) 通过测试发现是有问 ...
- k8s总结(脑图图片)
- Emgucv学习系列之环境搭建
Emgucv功能介绍 Emgucv是跨平台的,是Opencv的.net版本.可以对图片.视频等多媒体资源进行加工处理的SDK库. Emgucv下载和安装SDK 下载地址:https://sourcef ...
- 从零开始学 Web 之 BOM(三)offset,scroll,变速动画函数
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...