由于之前的公司都是传统开发模式，用的jq，出来之后感觉自己low爆了，如今前端技术更新的很快，不学习真的会被淘汰（血的教训啊），于是踏上了vue的学习之路，说实话，对于曾经很少学习拘泥于旧技术的我，刚开始看有点懵，看官网看的也有点烦，也看了一些教程，于是乎根据个人理解写了这篇文章，希望对初学者有一定帮助~
首先要安装vue，对于想先学语法也可以去官网下载文件直接引入，但那样是不是感觉太low了呢?我用的是npm安装的，接下来我介绍的是npm安装vue以及项目的创建。（由于是之前安装的，没想过会写文章，所以安装部分的截图会有欠缺，改天用同学电脑安装一下再把截图补全）
1、在安装vue之前，首先要安装node.js（去node官网下载你需要的版本，安装教程网上很多），安装完成之后，打开cmd命令行工具，分别输入node -v(中间有空格)，和npm -v查看版本，如果出现了版本说明安装成功~
2、然后可以进行接下来的安装了，但是在这里用npm安装会比较慢，因为npm是国外资源，所以这里也可以用国内的淘宝npm镜像，可以在命令行输入npm install -g cnpm --registry=https://registry.npm.taobao.org，
然后等待即可。教程及介绍可参考 http://npm.taobao.org/
，完成之后就可以用cnpm代替npm来安装了(接下来安装依赖也用cnpm)。
3、接下来就要安装vue-li，虽然官网上说不推荐新手使用vue-cli，我刚开始压根都不知道那是什么，虽然现在也不是很清楚具体干嘛用的，只知道是给你自动生成模板功能，可以初始化项目，然后怎么安装呢？在命令行输入 cnpm install -g vue-cli然后静静的等待安装就可以了，安装完成之后可以在命令行输入vue -V(V是大写)查看vue版本。
4、最后开始创建项目
可以进入到你想创建项目的目录，我想把项目创建在E盘，所以在命令行输入 E:然后进入E盘，
然后在命令行输入 vue init webpack myTest，(myTest是你所建项目的文件夹的名字)
然后输入项目名称，回车，然后注意，会有几个问题，第一个问题是问要不要用eslint，这个是一种代码语法规范检查的工具（比如空格，定义，标点符号等），我个人平时写代码规范不太好，所以就用了这个规范来给自己培养一个好的书写习惯，也可不用这个规范，如果不小心手滑启动了也没关系，后面会介绍如何去掉或者自己修改规范。下面两个问题不太知道干嘛的，看别人说那个是配置的模板，我用的standards，最后一个是单元测试，大部分人都不写~。然后打开你创建的项目路径，可以发现多了一个文件夹，就是你自己创建的项目，然后点开看到里面的文件。
看到这么多文件，也不知道啥是干啥的，暂时先不用管，我们平时主要在src里面写东西。
然后接下来要做什么，当然就是打开项目了，可是怎么打开呢，是直接在命令行输入npm run dev吗？当然不是！在这里首先要安装依赖，（以后不管是自己的项目或者下载了别人的项目，都要先安装依赖），依赖在哪里？依赖在package.json的文件夹里，
如图所示，里面全是项目的依赖，接下来先进入项目文件夹（可以直接在命令行输入cd myTest，也可以在文件夹里按住shift然后右键在命令行打开），然后在命令行输入cnpm install
，如上图所示，即安装成功~
发现项目文件里多了一个文件夹，里面都是依赖的模块~
接下来在命令行输入npm run dev来运行项目，等待，浏览器会自动打开一个页面，不会自动打开的可以在浏览器地址栏输入 http://localhost:8080/回车即可
到这里项目就成功的创建了~
到此为止你就可以做项目了，看文字对我来说是一件无聊的事，上面的文字看烦了下面的文字暂时不想看可以不看哦~~~
不过中间肯定会有疑惑，npm run dev里面的dev一直都是固定的吗？从哪里来的？它是从package.json里面来的
然后运行的端口默认为8080，如果我要运行多个项目的话端口号冲突的话就无法同时打开，那在哪里修改端口呢？正常生成的项目的话是在config文件的index.js里面，
如果是生成的精简版的项目（创建的时候输入vue init webpack-simple myTest），是在webpack.config.js里面
那如果安装的时候不小心手滑启动了eslint然后又不想用怎么办呢？你可以打开build文件夹，找到webpack.base.conf.js文件，找到下图部分的代码，删掉或者注释掉即可。
那么如何按照自己习惯写法修改eslint呢？
举个例子，比如我在一句话后面加了一个分号（eslint里面不需要加分号，否则会报错）
然后看页面发现之前的东西没了
然后再看命令行，发现报错了
发现错误原因是多了一个分号，然而我自己习惯在写完一句代码的时候加分号，于是我可以修改eslint规范，可根据上图的报错地址链接查看具体修改详情，这里就不多介绍具体内容了，可以自己打开链接看一下 http://eslint.org/docs/rules/semi
我直接说修改方法：
然后重新运行项目，退出运行的方法是Ctrl+c，然后npm run dev运行项目，发现命令行会报这样的错，
到此，说明你修改的eslint配置成功了，自此该项目以后你写的代码都要加分号。
eslint部分的配置以后就可以照此步骤去看文档来改~
那项目中生成的那么多文件是干嘛的呢？
~build文件中配置了webpack的基本配置，开发环境配置和生产环境配置
~node_modules里面是依赖的模块
~config里面是路径的端口
~static里面放置静态资源文件
~src里面放置入口文件和组件
~index.html是文件入口
到目前为止，我自己平时遇到的小问题是介绍完了，由于我也是初学者，遇到的问题可能不多，考虑问题也不够全面，如果接下来遇到有什么问题文章还会不断持续的优化更新，如有人读到这篇文章，欢迎提一些宝贵建议及指正一些错误~