vue2.0：项⽬开始，⾸页⼊门（main.js，App.vue,importfrom）对main.js App.vue 等进⾏操作：
但是这就出现了⼀个问题：什么是main.js，他主要⼲什么⽤的？App.vue⼜是⼲什么⽤的？main.js ⾥⾯的import from⼜在⼲
嘛？newVue（{}）是⼲嘛的？⾥⾯⼜需要什么参数，它到底能⼲什么。在⽹上搜了⼀篇博⽂，解答⼀些初级的困惑。
⼀、什么是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。
在这⾥只是给⼤家介绍下它在这⾥的⽤处。
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';
意思其实就是引⼊我们写好的.vue⽂件。
c.还可以有
import router from './route'; --------- import router from './route.js';
import axios from 'axios'; -------- import axios from '..\node_modules\axios\dist\axios.js';
import './less/index'; -------- import './less/index.less';
⼩结：在简书上看到有⼀个⼈总结的很好：
的from命令后⾯可以跟很多路径格式，若只给出vue，axios这样的包名，则会⾃动到node_modules中加载；若给出相对路径及⽂件前缀，则到指定位置寻找。
2.可以加载各种各样的⽂件：.js、.vue、.less等等。
3.可以省略掉from直接引⼊。
下⾯附作者原⽂：
作者：趁你还年轻233
链接：/p/c0be35475e54
來源：简书
⼆、App.vue⼜是⼲什么⽤的？
App.vue是我们的主组件，页⾯⼊⼝⽂件，所有页⾯都是在App.vue下进⾏切换的。也是整个项⽬的关键，app.vue负责构建定义及页⾯组件归集。
养鸡技术<template>
<div id="app">
<img src="./asts/logo.png">
<hello></hello>
</div>
</template>
<script>
import Hello from './components/Hello'
export default {
体适能教案name: 'app',
components: {
Hello
}
}
</script>
<style>
#app {
font-family: 'Avenir', Helvetica, Arial, sans-rif;
-webkit-font-smoothing: antialiad;
-moz-osx-font-smoothing: grayscale;
text-align: center;
color: #2c3e50;
margin-top: 60px;
}
</style>
三、router index.js是做什么的？
router index.js 把准备好路由组件注册到路由⾥：
import Vue from 'vue'
import Router from 'vue-router'
import Recommed from 'components/recommend/recommend'
夏天风import Singer from 'components/singer/singer'
import Rank from 'components/rank/rank'
import Search from 'components/arch/arch'
Vue.u(Router)
export default new Router({
routes: [
{
大纲级别如何设置path: '/',
component: Recommed
},
{
path: '/recommend',
二次根式的化简component: Recommed
},
{
path: '/singer',
component: Singer
},
{
path: '/rank',
component: Rank
},
{
榛蘑的做法path: '/arch',
component: Search
}
]
})
这⾥还有⼀些其他的⽂件意思：
1. index.html⽂件⼊⼝
2. src放置组件和⼊⼝⽂件
3. node_modules为依赖的模块
4. config中配置了路径端⼝值等
5. build中配置了webpack的基本配置、开发环境配置、⽣产环境配置等
