Vue项目开发配置与基本使用

最近两年越来越多的前端项目都在使用Vue，其简单，易用，容易上手，受到很多开发者的青睐。国内饿了么在Vue基础上又做了层封装，使其开发起来更加便捷，对于企业内部只会写后端的前端小白简直太有福利了。这次我根据公司内的基于Vue的框架开发做一次介绍说明，希望起到抛砖引玉的作用来帮助大家开始使用Vue项目。

配置与使用

1. Vue是基于js的，通常情况下会依赖node，使用npm来安装，有的公司可能会配置node源，那么首先配置node源，这样下载node包的时候就会快很多了。

方式一：npm install --registry=http://r.npm.10101111.com/    ，后面的地址记得要改为自己可以访问的源

方式二：编辑本地目录下的.npmrc文件，内容如下，注意这是在文件中，文件名为.npmrc

registry=http://r.npm.10101111.com/

2. 安装依赖的安装包

npm install

3. 如果依赖包安装完毕，那么使用npm start来启动项目，注意这里要看package.json的script中是否有这个脚本命令。

4. 根据业务的要求，编写你所需要的页面。如果是已经存在的项目，可以参考项目内已有的文件，如果是全新的项目，那么后面我们再多写一些Vue相关的文章，Vue的语法很简单。

5. 如果我们启动的端口与本地端口存在冲突，想要修改项目启动的端口，那么一般项目的config目录下会有index.js里面修改启动端口。如下

6. 开发的时候，要配置项目的菜单，一般在constants目录下面，或者在某个目录下有menu.js文件，修改其目录内容，这部分相信大家都能看得懂，不多赘述了。

7.  如果要请求后端的接口，那么一般在api.js中定义像后端请求的接口。在要使用的文件中，引入api.js然后调用

结束

这次先说下Vue项目的搭建与基本的配置，在使用的时候会用到许多vue的相关知识点，一般我们会参考官方文档，参考链接放在下面。

参考

Vue官方参考 https://vuejs.org/v2/guide/instance.html

注：

本文独家发布自金蝶云社区