首先,电脑安装了node.js官方要求8.9 或更高版本 (推荐 8.11.0+)

npm install -g @vue/cli
# OR
yarn global add @vue/cli

全局安装,(由于我用的是yarn 后续都使用yarn进行操作)

安装完成后有键入

vue --version

输出

@ vue/cli 4.2.2

说明安装成功。

开始创建项目

到想要创建项目的地方,键入

vue create demo 

回车

选择

然后,空格键选择

之后依据自己的需求选择即可,选择结束后自动会下载相应配置

启动项目

在项目中打开终端,键入

yarn serve

即可启动项目

添加element-ui

在终端中键入

yarn add element-ui

等待下载结束后

在main.js中全局引入element.js

import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import 'element-ui/lib/theme-chalk/index.css'
import ElementUI from 'element-ui' Vue.config.productionTip = false
Vue.use(ElementUI , { size: 'small'}) new Vue({
router,
store,
render: h => h(App)
}).$mount('#app')

已经全局引入了element-ui

之后就可以愉快地写项目了!

使用vue/cli 创建一个简单的项目的更多相关文章

  1. 软件----- idea 配置创建一个简单javase项目

    1.显示工具栏和工具按钮,勾选上 如图,在左侧会增加对应的 2.设置项目结构,选择jdk 点击new  选择需要jdk 3.创建一个简单的java文件,和eclipse与myeslipse 差不多, ...

  2. vue-cli安装以及创建一个简单的项目(一)(Node\npm\webpack简单使用)

    1.关系介绍 1.简单的说 Node.js 就是运行在服务端的 JavaScript. 2.NPM是随同NodeJS一起安装的包管理工具(新版的nodejs已经集成了npm),能解决NodeJS代码部 ...

  3. vue-cli安装以及创建一个简单的项目(二)(vuex使用、发行一个简单的app)

    1.vuex的使用 vuex是vue的状态管理中心,vuex来保存我们需要管理的状态值,值一旦被修改,所有引用该值的地方就会自动更新,常用于: 1.多个视图依赖同一状态(l例:菜单导航) 2.来自不同 ...

  4. 【Django】01_创建一个简单的项目

    1.创建Django项目 点击:file-->new project,出现下面的对话框.选择Django栏目,输入项目名称, 选择python解释器版本,点击create创建. Django将自 ...

  5. Windows 8.1 应用再出发 (WinJS) - 创建一个简单项目

    前面几篇我们介绍了如何利用 C# + XAML 完成Windows Store App 功能的实现,接下来的几篇我们来看看如何利用 Html + WinJS 来完成这些功能. 本篇我们使用WinJS ...

  6. 使用Cocos studio创建一个简单的project

    前不久我接到了一个项目,项目要求使用Cocos2d-X的最新版本号,Cocos2d-X3.4.对于一直在陶醉在Cocos2d-X2.2.3的世界中的我开说,使用Cocos2d-X3.4忽然认为有点不适 ...

  7. 用IntelliJ IDEA学习Spring--创建一个简单的项目

    这段时间想学习一下Spring,其实之前学过Spring,只是有些忘记了.而且之前学的时候是适用eclipse学习的,现在好像对IntelliJ这个工具使用挺多的,现在就学习一下这个工具的用法,顺便复 ...

  8. Vue Create 创建一个新项目 命令行创建和视图创建

    Vue Create 创建一个新项目 命令行创建和视图创建 开始之前 你可以先 >>:cd desktop[将安装目录切换到桌面] >>:vue -V :Vue CLI 3.0 ...

  9. vue cli创建typescript项目

    使用最新的Vue CLI @vue/cli创建typescript项目,使用vue -V查看当前的vue cli版本 安装命令 npm install -g @vue-cli 创建项目 vue cre ...

随机推荐

  1. 某cms审计思路,以及ci框架如何找寻注入点

    某cms审计思路,以及ci框架如何找寻注入点 ABOUT 之前闲着没事的时候审的某cms,之前看一群大表哥刷过一次这个cms,想着看看还能不能赶得上分一杯羹,还是审计出来些东西,来说一说一个前台注入吧 ...

  2. centos7 安装 iRedmail 后 给nginx添加虚拟主机

    iRedmail安装参考官方文档和 https://ywnz.com/linuxyffq/4563.html 准备工作 更新操作系统 yum update -y 安装必要组件 yum install ...

  3. [Effective Java 读书笔记] 第二章 创建和销毁对象 第二条

    第二条 遇到多个构造器参数时,可以考虑用构建器 当遇到有多个构造器参数时,常见的是用重叠构造器,即: public class TestClass{ public TestClass(int para ...

  4. python常用模块集合

    python常用模块集合 Python自定义模块 python collections模块/系列 Python 常用模块-json/pickle序列化/反序列化 python 常用模块os系统接口 p ...

  5. Kail Linux下载与安装

    官方镜像: https://www.kali.org/downloads/ 官方虚拟机镜像: https://www.offensive-security.com/kali-linux-vm-vmwa ...

  6. linux下(centos7)docker安装

    参考链接https://docs.docker.com/install/linux/docker-ce/centos/ 第一步,确定是centos7及以上版本 cat /etc/redhat-rele ...

  7. python——异常(1),捕获特定异常

    """1.捕获指定异常,异常类型有多种2.若尝试执行的代码异常类型与捕获的异常类型不同则报错3.try下方一般只放一行代码,若有多行可能异常代码,则捕获一个异常类型后函数 ...

  8. C#上位机之—WinForm实现Socket异步通讯示例

    工作中常用到的一些知识点,总是用完就忘,第一次尝试用博客记录下来,以备后用: Socket通讯,Socket(套接字)是基于TCP/IP通讯方式的封装好的类,调用时需要添加下面的服务引用: using ...

  9. IDEA 代码量统计(Statistic)

    IDEA 代码量统计(Statistic) 1.1 前言 项目到了一定阶段,都会想要看看项目的代码量情况,这里主要使用插件Statistic进行代码统计查看. 1.2 安装插件步骤 找到插件市场入口并 ...

  10. Bilibili手机端下载的Download文件批量转换为MP4软件【Bilibili_DownVideoToMp4】原创发布

    Bilibili手机端下载的Download文件批量转换为MP4软件[Bilibili_DownVideoToMp4]原创发布 起因 Bilibili手机端的视频下载下来只能在手机上看,手机屏幕太小看 ...