vue2目录及文件结构解析

一、首先创建一个vue项目，如：my-vue,其代码结构如下：

由上图分析每个文件的作用：

二、我们主要工作src文件夹的分析结构如图：

这是src文件夹下面的初始情况，里面有一些示例代码之类的。比如，它吧logo放在assets文件夹里面。我个人很不喜欢这么做，因为代码是代码，资源是资源，各归其位比较好。

commponents 目录里面放了一个演示的组件文件，你可以打开看下。当然，也可以直接删除，然后根据我的博文往下走。

App.vue 是项目入口文件。当然，我们需要改造，改造成我们可以使用的样子的。

main.js 这是项目的核心文件。全局的配置都在这个文件里面配置。

整理目录

下面，我们开始动手，把不想管的干掉，然后把src变成这个样子:



如上图所示，把文件夹和文件都新建好，后面的博文我会详细给出每个文件的代码的。这里，都新建空文件即可。注意，我是用scss来写css文件的。所以看官你最好也学习一下scss的相关内容，我的博客里面有，搜索也是一大把。