学习Vue过程笔记和难点讲解（二）：main.js介绍

参考资料：https://www.cnblogs.com/beyrl-blog/p/8625145.html

一、什么是main.js?里面一般都是些什么内容？

1、 main.js 程序入口文件，是初始化vue实例并使用需要的插件,加载各种公共组件.

import Vue from 'vue'
import App from './App'

/* eslint-disable no-new */
new Vue({
  el: '#app',
  template: '<App/>',
  components: { App }
})

2.import from 是干嘛的呢？
　实际上，importfrom是ES6语法里面的。因为相关知识很多，具体参见博客里ES6里面的import，export。

在这里只是给大家介绍下它在这里的用处。

2.1
a

import Vue from 'vue';
等价于
import Vue from "../node_modules/vue/dist/vue.js";

意思是：因为main.js是在src文件中，所以…/向前一级相对目录查找node_modules，再依次寻找后面的文件。

b

import App from './App';
　　　　其实最完整的写法是：
import App from './App.vue';

总的来说，import from 后面from的后缀可以省略

• 1.import…from…的from命令后面可以跟很多路径格式，若只给出vue，axios这样的包名，则会自动到node_modules中加载；若给出相对路径及文件前缀，则到指定位置寻找。
• 2.可以加载各种各样的文件：.js、.vue、.less等等。
• 3.可以省略掉from直接引入。

二、App.vue又是干什么用的？

App.vue是我们的主组件，页面入口文件 ，所有页面都是在App.vue下进行切换的。也是整个项目的关键，app.vue负责构建定义及页面组件归集。

三、router index.js是做什么的？

router index.js 把准备好路由组件注册到路由里：

其他文件

1. index.html文件入口
2. src放置组件和入口文件
3. node_modules为依赖的模块
4. config中配置了路径端口值等
5. build中配置了webpack的基本配置、开发环境配置、生产环境配置等