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) 在单个模版里面同时支持太多选项会导致模 ...
随机推荐
- 从零开始的程序逆向之路 第一章——认识OD(Ollydbg)以及常用汇编扫盲
作者:Crazyman_Army 原文来自:https://bbs.ichunqiu.com/thread-43041-1-1.html 0×00 序言: 1.自从上次笔者调戏完盗取文件密码大黑客后, ...
- 第二十五节:Java语言基础-面向对象基础
面向对象 面向过程的代表主要是C语言,面向对象是相对面向过程而言,Java是面向对象的编程语言,面向过程是通过函数体现,面向过程主要是功能行为. 而对于面向对象而言,将功能封装到对象,所以面向对象是基 ...
- Linux 系统资源管理-top-cpu
- Linux开机执行指定shell
目的:希望linux在开机或重启后第一时间启动部分服务或者执行特定脚本 1.需要在/etc/init.d/目录下建立对应的shell脚本,示例如下: 开机启动docker-compose中的所有容器 ...
- IntelliJ Idea 授权服务器使用
JetBrains授权服务器 1 http://intellij.mandroid.cn/ 支持的版本 IntelliJ IDEA 7.0 或更高ReSharper 3.1 或更高ReSharper ...
- numpy中array和asarray的区别
array和asarray都可以将结构数据转化为ndarray,但是主要区别就是当数据源是ndarray时,array仍然会copy出一个副本,占用新的内存,但asarray不会. 举例说明: imp ...
- python实现桶排序算法
桶排序算法也是一种可以以线性期望时间运行的算法,该算法的原理是将数组分到有限数量的桶里,每个桶再分别排序. 它的算法流程如下所示: 设置一个定量的数组当作空桶子. 寻访序列,并且把项目一个一个放到对应 ...
- Java访问文件夹中文件的递归遍历代码Demo
上代码: import java.io.File; /* * 需求:对指定目录进行所有内容的列出(包含子目录中的内容) * 也可以理解为 深度遍历. */ public class FindAllFi ...
- JavaScript “跑马灯”抽奖活动代码解析与优化(一)
最近的项目中做了一个"跑马灯"的抽奖特效插件.上篇文章已经分享过html和css 的相关知识.这篇文章主要分享一些 JavaScript 相关的知识.这几天在写这篇文章的时候,也顺 ...
- linux | 网卡驱动
linux 1. 查看网卡信息 lspci | grep -i 'eth' 1a:00.0 Ethernet controller: Intel Corporation Ethernet Connec ...