第一步:安装 Node.js/NPM

  下载Node.js:https://nodejs.org/zh-cn/download/

  下载安装即可。

第二步:安装 vue-cli

  打开 cmd 创建,在命令行下执行命令即可安装:

npm install -g @vue/cli

  安装完后,会有一个 vue 命令可以被调用:   

vue --version

如果没有,请从重新开始!

第三步:创建新的项目

  打开 cmd 窗口,切换到相关工作目录:

  例:项目在D盘,mydemo文件夹中。

  

D:

cd  mydemo

  然后在,命令行下,使用vue创建项目:

vue create vue-demo

  等待项目创建,创建成功后显示:

 第四步:添加ElementUI支持

  继续在命令行,敲入命令:

vue add Element 

  如果有提醒,分别选择:

    1. Full Import? Enter
    2. SCSS support? N
    3. ZH-CN

   等待完成即可!

第五步,增加 router 支持

  在上述的命令行下,敲入命令: 

     vue add router

  如果有提醒,选择“回车”,“回车”….

  等待完成即可!

 

 

从0开始搭建Element项目的更多相关文章

  1. 使用 Maven 来管理项目 & 从 0 开始搭建 Maven 项目

    maven 是 apache 的一个开源软件,纯 Java 编写的,专门用于管理 Java 项目的一个工具. maven 就是一个工具而已,用不用都不耽误你刷刷的敲代码,那为什么我们还要学习它呢? 那 ...

  2. 【Dotnet9-01】从0开始搭建开源项目-lqclass.com

    行文目录 一. 前言 1.1 我的现有网站 1.2 想法:新开发一个网站 1.3 目前开发计划 二. 行动了 2.1 Github创建项目 2.2 使用 WTM 搭建后台框架 2.3 项目演示 2.4 ...

  3. vue-cli3.0 脚手架搭建项目的过程详解

    1.安装vue-cli 3.0 ? 1 2 3 npm install -g @vue/cli # or yarn global add @vue/cli 安装成功后查看版本:vue -V(大写的V) ...

  4. vue cli3.0快速搭建项目详解(强烈推荐)

    这篇文章主要介绍下vue-cli3.0项目搭建,项目结构和配置等整理一下,分享给大家. 一.介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统.有三个组件: CLI:@vue/cl ...

  5. Vue3实战系列:Vue3.0 + Vant3.0 搭建种子项目

    最近在用 Vue3 写一个开源的商城项目,开源后让大家也可以用现成的 Vue3 大型商城项目源码来练练手,目前处于开发阶段,过程中用到了 Vant3.0,于是就整理了这篇文章来讲一下如何使用 Vue3 ...

  6. element-ui和npm、webpack、vue-cli搭建Vue项目

    一.element-ui的简单使用 1.安装 1. npm 安装 推荐使用 npm 的方式安装,它能更好地和 webpack 打包工具配合使用. npm i element-ui -S 2. CDN ...

  7. 【gin-vue-admin】 使用go和vue 快速搭建一个项目模板

    gin-vue-admin gin+vue开源快速项目模板 项目地址:https://github.com/piexlmax/gin-vue-admin 增加了 micro-service-test分 ...

  8. vue 快速入门 系列 —— 使用 vue-cli 3 搭建一个项目(上)

    其他章节请看: vue 快速入门 系列 使用 vue-cli 3 搭建一个项目(上) 前面我们已经学习了一个成熟的脚手架(vue-cli),笔者希望通过这个脚手架快速搭建系统(或项目).而展开搭建最好 ...

  9. 零配置简单搭建SpringMVC 项目

    SpringMVC是比较常用的JavaWeb框架,非常轻便强悍,能简化Web开发,大大提高开发效率,在各种Web程序中广泛应用.本文采用Java Config的方式搭建SpringMVC项目,并对Sp ...

随机推荐

  1. Linux多线程 - 基本操作

    0. 线程 vs 进程 何为线程?线程即轻量级进程,如何理解轻量级这个概念? 我们知道,Linux的资源分为用户空间资源和内核空间资源: 用户空间资源:用来存放用户自定义的一些数据,用户可直接控制: ...

  2. IE浏览器版本的判断

    var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 && userAgent.indexOf(; //判断是否IE< ...

  3. 机器学习classification_report方法及precision精确率和recall召回率 说明

    classification_report简介 sklearn中的classification_report函数用于显示主要分类指标的文本报告.在报告中显示每个类的精确度,召回率,F1值等信息. 主要 ...

  4. plupload如何删除一条数据

    FilesRemoved用了发现不成功,删除图片这么重要怎能如此 看到老外提的另一个问题发现这个问题解决办法,特此备注以供不会的童鞋参考 uploader.bind('FilesAdded', fun ...

  5. 自己写一个java的mvc框架吧(一)

    自己写一个mvc框架吧(一) 目录 自己写一个mvc框架吧(一) 自己写一个mvc框架吧(二) 自己写一个mvc框架吧(三) 自己写一个mvc框架吧(四) 写之前的一些废话 废话 1 (总是要先随便说 ...

  6. Spring系列之——springboot解析resources.application.properties文件

    摘要:本文通过讲解如何解析application.properties属性,介绍了几个注解的运用@Value @ConfigurationProperties @EnableConfiguration ...

  7. vue+element ui 的tab 动态增减,切换时提示用户是否切换

    前言:工作中用到 vue+element ui 的前端框架,动态添加 Tab,删除 Tab,切换 Tab 时提示用户是否切换等,发现 element ui  有一个 bug,这里记录一下如何实现.转载 ...

  8. 针对多类型数据库,集群数据库的有序GUID

    一.背景 常见的一种数据库设计是使用连续的整数为做主键,当新的数据插入到数据库时,由数据库自动生成.但这种设计不一定适合所有场景. 随着越来越多的使用Nhibernate.EntityFramewor ...

  9. Maven 使用 Nexus 内部库 代理

    反正任由总理怎么强调,在中国的当前的网络环境下,中央库的访问速度总是令人心碎.建一个nexus内部库可以建立缓存,只要有人通过它下载了相关的maven依赖,那么别人需要时可以马上从本地网络的服务器上返 ...

  10. 【 js 片段 】如何组织表单的默认提交?【亲测有效】

    最近做的一个项目,我分到的部分有表单验证.点击了提交按钮,但我并不想让他跳转页面去提交.于是经过各种百度,各种 stackoverflow,各种抱大神腿之后,有了以下解决办法: 重点就是阻止 form ...