安装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. BZOJ1556 墓地秘密

    题意 费尽周折,终于将众将士的残骸运送到了KD军事基地地底层的大型墓地入口.KD的伙伴和战友们都参加了这次重大的送葬仪式.右边是一扇敞开的大门,进去便是墓地了,左边是一堵凹进去的墙,没有什么特别的地方 ...

  2. Elixir's keyword lists as option parameters

    备注: 文章转自:https://www.djm.org.uk/posts/writing-extensible-elixir-with-behaviours-adapters-pluggable-b ...

  3. python一些内建函数(map,zip,filter,reduce,yield等)

    python一些内建函数(map,zip,filter,reduce,yield等) map函数 Python实际上提供了一个内置的工具,map函数.这个函数的主要功能是对一个序列对象中的每一个元素应 ...

  4. 在Centos中yum安装和卸载软件的使用方法(转)

    在Centos中yum安装和卸载软件的使用方法 安装方法 安装一个软件时 yum -y install httpd 安装多个相类似的软件时 yum -y install httpd* 安装多个非类似软 ...

  5. 如何在项目中使用requireJS

    本文主要讲讲如何在一个项目中合理的使用requireJS,来加载js代码,这里是个实际例子,讲解不多, 看详情请连接到:http://www.cnblogs.com/evaling/p/6722760 ...

  6. Android screencap截屏指令

    查看帮助(注意:有的网友错误使用 screencap -v ,结果差不多,因为系统不能识别-v,就自动打印出帮助信息) # screencap -hscreencap -husage: screenc ...

  7. bfs判断子图是否连通

    int judge() { int v[13] = { 0 }; queue<int> myq; myq.push(ans[0]); v[ans[0]] = 1; while (!myq. ...

  8. 制作mysql数据快照

    在建立主从关系时,如果主上有旧数据,需要将旧数据拷贝到每一个从上.下面介绍几种不同的拷贝方式. 方法一:使用mysqldump工具创建一个你想要复制的所有数据库的一个dump.这是推荐使用的方法,特别 ...

  9. 阿里云中域名的MX记录添加方法

    如何添加阿里云的MX记录 1. 登录阿里云,点击“云解析”,点击自己想要添加MX记录的域名: 2. 点击新手引导设置: 3. 点击解析设置,自动跳出“设置网站”和“设置邮箱”: 4. 跳出的页面,选择 ...

  10. mysql 存储过程简单学习

    转载自:http://blog.chinaunix.net/uid-23302288-id-3785111.html ■存储过程Stored Procedure 存储过程就是保存一系列SQL命令的集合 ...