安装vue-cli

npm install -g @vue/cli

1, 使用vue创建一个项目

vue create luffy

2, 安装所需的插件

npm install vue-router

npm i element-ui -S

安装之后可在package.json中的查看

3,在工作目录src下创建router.js, 在components文件下创建Home组件

4, 在main.js(入口文件中导入)

5, 执行流程

  1, 执行main.js的入口文件,通过$mount("#app"),找到App.vue,然后进行渲染

  2, 在App.vue中导入,注册,添加组件

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

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

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

  2. 【vue】创建一个vue前端项目,编译,发布

    npm: Nodejs下的包管理器. webpack: 它主要的用途是通过CommonJS的语法把所有浏览器端需要发布的静态资源做相应的准备,比如资源的合并和打包. vue-cli: 用户生成Vue工 ...

  3. 使用vue/cli 创建一个简单的项目

    首先,电脑安装了node.js官方要求8.9 或更高版本 (推荐 8.11.0+) npm install -g @vue/cli # OR yarn global add @vue/cli 全局安装 ...

  4. 安装Vue和创建一个Vue脚手架项目

    首先 安装node.js,安装成功可以在控制台输入[node --version ]查看node的版本,因为安装了node会自带npm所以我们可以用 [npm --version]查到npm版本  如 ...

  5. 如何利用vue脚手架创建一个vue项目

    1.安装node.js 2.打开命令行查看下npm和node是否都安装好 node -v npm -v 3.安装淘宝镜像cnpm $ npm install -g cnpm --registry=ht ...

  6. 前端框架之Vue(1)-第一个Vue实例

    vue官方文档 知识储备 es6语法补充 let 使用 var 声明的变量的作用域是全局. { var a = 1; } console.info(a); 例1: var arr = []; for ...

  7. vue cli创建typescript项目

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

  8. Vue CLI 创建项目

    使用命令创建VUE项目 运行以下命令[vue create [项目名]]来创建一个新项目: vue create hello-world 警告 如果你在 Windows 上通过 minTTY 使用 G ...

  9. 创建一个vue项目的过程

    创建一个vue项目: 1.首先从UI手上拿到PSD设计图,然后看设计搞的内容,需要做个大概的页面布局 2.做vue之前不许安装node,因为做vue项目要和node结合使用 3.然后安装vue脚手架: ...

随机推荐

  1. 洛谷 P3802 小魔女帕琪

    传送门 题目大意:7个东西,每个有ai个,只有选7次 把7个东西都选到了才行. 题解:7!排列数*每次选择的概率 代码: #include<iostream> #include<cs ...

  2. distinct和group by的性能比较

    distinct和group by的性能比较 当去重复的字段 的个数比较多的时候,group by 比distinct要快很多 当去重复的字符 的个数比较少的时候,distinct 比group by ...

  3. 异常处理—Exception(二)

    在上一篇中"异常处理--Exception(一)"中,跟大家简单介绍了一下Exception,也使大家充分的了解了Exception管理在一个项目中的重要性,那如何在我们的项目中处 ...

  4. Java中文件的常用操作

    一.文件的移动 File afile =new File("D:\\workspace\\Test\\test.avl");  if(afile.renameTo(new File ...

  5. linux中sar的详细使用

    在使用UNIX操作系统的过程中,我们常常会用到各种各样的问题,比如系统运行速度突然变慢,系统容易死机或者主机所带的终端常出现死机,这时我们常常猜测,是硬盘空间太小,还是内存不足?I/O出现瓶颈,或者是 ...

  6. BZOJ1590:[Usaco2008 Dec]Secret Message秘密信息

    浅谈\(Trie\):https://www.cnblogs.com/AKMer/p/10444829.html 题目传送门:https://lydsy.com/JudgeOnline/problem ...

  7. python-生成测试报告-然后自动发送邮件

    前两篇单独介绍了生成测试报告和自动发送邮件,那么现在把两者整合到一起:生成测试报告后然后自动发送邮件,这里只是简单的整合实现功能,其实还可以优化的,先用吧,后面再慢慢优化 先看下目录,其实目录还是一样 ...

  8. 【备忘】windows环境下20行php代码搞定音频裁剪

    先上图,由于最近的需求需要对语音文件进行处理,所以抽空研究了下php处理音/视频文件的处理,简单的demo处理,截取一个音频文件的前20秒,并保存新的媒体文件. 操作步骤: ①在此站点下载所需的辅助程 ...

  9. python 面向对象(三大特性)

    python 面向对象(初级) (思维导图 ↑↑↑↑↑) 概述: 面向过程:根据业务逻辑从上到下垒代码. 函数式:将某功能代码封装至函数中,日后便无需重复编写,仅调用函数即可 面向对象:对函数进行分类 ...

  10. python多标签分类模版

    from sklearn.multioutput import MultiOutputClassifier from sklearn.ensemble import RandomForestClass ...