1、assest:

图片等等......

2、components:

组件

3、App.vue:

根组件,三个部分:模板、行为(处理逻辑)、样式;

模板:

只能有一个根标签;

<HelloWorld/>

行为里面引入组建后,用这个标签来对它们之间产生关联;

行为:

import HelloWorld from './components/HelloWorld'

这是另外一个组件,用来关联组件,组件可以理解为一个功能的页面,项目都是由多组件来完成的;

export default{

  name:'app',

  components:{ HelloWorld,Home }

}

这里是注册组件;需要先引入组件,再注册,再写出来标签,才能真正产生关联;

4、main.js(重要):

跟index.html有直接的联系,当执行完index.html后紧接着执行的就是main.js;

import Vue from 'vue'

引入vue就可以在下面实例化出来

new Vue({

  el:'#app',  //el:element,'#app'就是index.html中的id=‘app’

  template:'<App/>',  //'<App/>'组件调用的标签

  components:{ App }  //调用App这个组件

})

Vue--的src文件的更多相关文章

  1. Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置

    Vue 框架-11-介绍src文件流程及根组件app+HBuilder 配置 这是上一篇对目录简单介绍: 关于编辑器,可以使用轻量级的 Sublime Text 3,我使用的是 HBuilder, 但 ...

  2. vue 构建项目 文件引入

    1.vue引用依赖文件.  举例:axios 先安装 axios.如果直接安装 vue-axios 会报错 npm install axios npm install --save axios vue ...

  3. 前端vue实现pdf文件的在线预览

    3.前端vue实现pdf文件的在线预览 我是通过 <iframe> 标签就可以满足我工作的 pdf预览需求 如果<iframe> 无法满足需求 , 可以使用pdf.js这个插件 ...

  4. vue打包dist文件时,图片找不到

    1.vue打包dist文件时,图片找不到,无法像在本地一样查看 问题描述: 本地代码:<div class="icon"><img :src="'../ ...

  5. vue中的文件上传和下载

    文件上传 vue中的文件上传主要分为两步:前台获取到文件和提交到后台 获取文件 前台获取文件,主要是采用input框来实现 <el-dialog :title="addName&quo ...

  6. VUE组件 单独文件封装

    https://www.cnblogs.com/SamWeb/p/6391373.html vuejs 单文件组件.vue 文件   vuejs 自定义了一种.vue文件,可以把html, css, ...

  7. Vue 多路由文件的合并

    Vue 多路由文件的合并 1.使用的是ES6 数组的合并方法 let routes = new Set([...routes1, ...homerouters]);2.两个路由文件,导出的实际上就是一 ...

  8. vue之element-ui文件上传

    vue之element-ui文件上传 文件上传需求 ​ 对于文件上传,实际项目中我们的需求一般分两种: 对于单个的文件上传,比如拖动上传个图片之类的,或者是文件. 和表单一起实现上传(这种情况一般都是 ...

  9. vue 设置头文件

    vue的头文件是在index.html文件中设置的,毕竟vue的入口 先说一下标签页的名字: 就是这个名字的设置,要想每个标签页的名字都不一样,需要做以下这三步:1. 首先,在index.html文件 ...

  10. vue 上传文件 和 下载文件

    Vue上传文件,不必使用什么element 的uplaod, 也不用什么npm上找的个人写的包,就用原生的Vue加axios就行了, 废话不多说,直接上代码:html: <input type= ...

随机推荐

  1. day 7-13 数据库的数据类型

    一. 数据类型 存储引擎决定了表的类型,而表内存放的数据也要有不同的类型,每种数据类型都有自己的宽度,但宽度是可选的 注意:int类型的宽度是显示宽度,并非是数据的存储宽度 详细的介绍:http:// ...

  2. 本地数据访问时出现跨域问题Cross origin requests are only supported for protocol schemes: ……

    从桌面找到Chrome图标,右键属性,快捷方式,起始位置(安装路径) 注:在cmd中访问Program Files文件的方法 %ProgramFiles%=C:\Program Files %Prog ...

  3. StringTokenizer

    StringTokenizer是一个用来分隔String的应用类,相当于VB的split函数. 1.构造函数 public StringTokenizer(String str) public Str ...

  4. shell自定义输入输出 read+echo

    自定义格式输入.输出(244)  输出:echo -e 解释转义字符 -n  回车不换行 \n   新的一行,等同于回车 \t 制表符 \r 回车 \b 回退 baskspace 删除键 演示\n \ ...

  5. How to split DMG on macOS

    hdiutil segment /users/test/test1.dmg -segmentsize 4000m -o /users/test/test2.dmg

  6. Paint it really, really dark gray CodeForces - 717E

    Paint it really, really dark gray CodeForces - 717E 题意 有一棵树 每个结点是粉色或黑色 每经过一个结点 就改变他的颜色 从1开始遍历 打印出一条路 ...

  7. Ubuntu 16.04配置Java Web开发环境

    说明:在Linux下无论是开发还是服务器配置,我个人建议都安装二进制包版本的,优点:配置清晰,容易发现问题,性能调优方便等.缺点:配置太复杂.而其余平台的建议是一键安装版本,毕竟都是用于测试的,不会实 ...

  8. Cetos 中添加bbr服务

    说明:此方法只适用于KVM架构的,OpenVZ平台无法使用: 一:安装bbr服务: # wget --no-check-certificate https://github.com/teddysun/ ...

  9. Python课程目录

    Python基础1 介绍.基本语法.流程控制 Python基础2 列表.字典.集合 Python基础3 基础3-函数

  10. 启发式合并&线段树合并/分裂&treap合并&splay合并

    启发式合并 有\(n\)个集合,每次让你合并两个集合,或询问一个集合中是否存在某个元素. ​ 我们可以用平衡树/set维护集合. ​ 对于合并两个\(A,B\),如果\(|A|<|B|\),那么 ...