手把手教你学习vue.js。 搭建vue.js框架（一）

创作介绍

这几年前端出了很多前端框架比较火。比如 vue.js 、 Angular.js 和 Ext.js，小编也学习了一下。小编了解得不多，也没很深入得学习啥。就在实际项目中简单得运用了一下下。今天想重新打磨一下基础得。准备从头在搞一遍，特写记录下我得学习过程，希望能帮助想要了解的或者想学习的初学者。 小编这个里就写的是vue.js。因为这个听的比较多吧！个人爱好而已了。

首先我是要选一个开发者工具，这个网上有很多。比如说WebStorm 、 vscode等等，这些工具都没得一定的，据小编的了解这两个是大部分人在用的。小编习惯性用vscode。个人比较觉得vscode比较轻量级，内存不大。

先从官网下载vscode然后直接安装。 vscode：https://code.visualstudio.com/download 这个仅仅是开发工具而已，还需要安装一个就是node.js。 node.js: https://nodejs.org/en/download/

这个两个下载好了然后直接双击安装。都是直接下一步下一步了，小编在这里就不一一截图了。 nodejs安装完后，或者想查一下本机有没有安装成功。直接Windows + R 键，输入cmd，直接回车 然后出现dos命令窗体，直接输入node -v 查询当前版本。 如果安装成功了 这边就显示node的版本。vscode安装完后桌面会有一个图标，也有默认打开一个窗口。 这就是安装vscode成功并启动的界面。接下来我们就直接搭建一个vue的框架。 好了废话不多说了这里直接开始了。 首先打开dos命令窗口。然后可以用dos命令到指定文件夹里面这里文件夹就是项目文件夹。 我这边设置的是d盘的project文件夹。

如图这里两个命令第一个是安装高手架，安装这个就可以了。后面安装文件包都是通过npm去安装的。 这个我就不多做解释了。 那接下来怎么创建一个项目工程呢？接下来看！！！ 如图直接创建一个vue的项目了，这个时候你按照上面输入自己的项目名称，作者啥的信息。 其他的不知道的就直接默认就行了。然后就一路回车下去，然后就等待，等看到下图

等看到这个时候就表示已经创建成功了。这个时候就可以去对应的文件夹里面查看我们的项目 这是成功后生成的项目结构。 这个时候我们是不是想启动一下原始项目是啥样子的？大家可以直接输入dos命令 npm run dev。回车 然后就可以看到如下信息：

看到了最后有一个连接地址是http://localhost:8080. 直接复制这个地址。然后在浏览器里面粘贴并转到。这个时候我们就可以看到一个原始的界面

这个时候说明我们项目创建成功了。 好了第一篇就写到这里了，下一篇给大家介绍一下项目结构吧 ，然后我们该怎么去写自己的东西/

若是有啥不懂得，可以私信给小编，小编看到了定会及时回复得。 小编在微信公众号中会有一写c#开发基础，从零开始学习c#开发。也欢迎大家关注一下哦。需要什么工具得也可以找小编哦。