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. macbookpro 以及 surface 的技术规格

    macbookpro 13.3 英寸 (对角线) LED 背光显示屏 (采用 IPS 技术):初始分辨率 x ( ppi),支持数百万色彩 15.4 英寸 (对角线) LED 背光显示屏 (采用 IP ...

  2. Oracle 条件判断函数decode和case when then案例

    --decode条件判断函数 ,,,,,) from dual --需求:不通过连表查询,显示业主类型名称列的值 ,,,'商业','其他') from t_owners --case when the ...

  3. PLA-1

    PLA(Principal Component Analysis)主成分分析: 思路1:坐标旋转 1.数据分布以及投影: 2.特征值以及特征向量 思路2: 未完待续...

  4. linux audit审计(4)--audit的日志切分,以及与rsyslog的切分协同使用

    audit的规则配置稍微不当,就会短时间内产生大量日志,所以这个规则配置一定要当心.当audit日志写满后,可以看到如下场景: -r-------- 1 root root 8388609 Mar 3 ...

  5. Calendar用法随笔

    平时在处理时间问题的时候,一般会想到用java.util.Date类型,在使用倒时间的运算的时候,就不是很方便,找找到了java.util.Calendar类,中文意思是“日历”,以下就是自己对这个类 ...

  6. WPF TextBox控件中文字实现垂直居中

    TextBox纵向长度比较长但文字字体比较小的时候,在输入时就会发现文字不是垂直居中的. 而使用中我们发现,TextBox虽然可以设置文字的水平对齐方式,但却没有相应的属性让我们来调节他的垂直对齐方式 ...

  7. Nginx 针对建立TCP连接优化

    L:124 sysctl -a | grep file-max //通过命令查看系统最大句柄数 [root@3 ~]# sysctl -a | grep file-max fs.file-max = ...

  8. Auth模块使用方法大全

    auth认证 导包 from django.contrib import auth 默认数据库中使用auth_user表 创建超级用户 python manage.py createsuperuser ...

  9. Nginx+uwsgi部署 Diango(生产环境)

    环境:CentOS6.5 + Nginx1.11.5 + Python3.5.2 1. 安装基础软件包 yum install -y zlib-devel bzip2-devel \ pcre-dev ...

  10. HDU4292-Food-网络流

    裸网络流题. #include <cstdio> #include <algorithm> #include <cstring> #include <queu ...