设计师稿件完成以后，下一步交给程序员，而程序员需要切图，搭建网站框架，用代码去实现这些功能。网站框架搭建时需要注意哪些方面的因素？怎么搭建，接下来和大家具体聊一下。

#环境搭建

1.安装node环境

访问https://nodejs.org/en/download/或者https://nodejs.org/下载node进行安装，windows下node安装与普通软件安装无差别，下一步，知道安装完毕即可。

2.测试node环境是否安装完毕

Cmd运行命令行，node –version 查看node版本信息

3.Npm随node一起安装的，还有npm包管理工具，运行npm –v  查看npm版本

4.Git安装

Vue框架需要下载官网搭建好的demo,所以需要git工具下载安装包基本配置信息。点击git下载安装包，安装。

5.蓝灯翻墙

安装vue依赖包需要访问github,如不能访问，请安装chrome翻墙工具蓝灯自行下载安装。如不能访问，请自行解决。

6.到此，基本环境信息搭建完毕。其他系统安装，请自行查阅资料。

#安装vue-demo

1.下载vue官方demo依赖包

1.在空闲盘符新建空白文件件，这里，我们选取e盘，app文件夹

2.打开git工具，cd e/app,切换到e盘app目录

3.使用git命令git clone https://github.com/vuejs-templates/webpack.git下载vue环境依赖包，这里我们推荐后者，官方完整包。

4.下载完成后，我们使用hbuild打开项目目录，就可以看到如下目录。

2.安装vue脚手架工具vue-cli

1.打开命令行，切换到e/app,运行命令行npminit，设置项目基本信息，安装环境依赖

2.安装完毕后，运行命令vue-cli –save-dev,安装vue-cli工具,并添加到项目依赖配置。

3.运行npm run dev,就可以看到node环境下的界面了。（这里显示的为修改后的页面）

程序员搭建网站框架，需要考虑到各个点，每一个环节都需要进行对症校验，确保不会在某一个环节中出错，或者是出现一些问题。搭建框架不仅需要细心，还需要有一定的耐心。