vueThink傻瓜式安装方式和项目发布

简介：vueThink是一款基于vue和tp5.0开发的前后端模板分离的框架， 前端只负责处理api接口返回的数据即可，通过统一的路由对应模式,开发效率还是蛮快的。

　　   而且饿了么ui还提供了很多组件可以供你们使用，如果有些组件安装后无效果，记得升级下饿了么ui版本（npm install --对应版本）

 

开发编辑器建议使用： phpstorm2017版，里面扩展可以安装vue语法的插件支持，开发起来会省很多事

 

使用vue前提环境准备：

 

1.安装node.js
 前端部分是基于node.js上运行的，所以必须先安装node.js，版本要求为6.9.0以上(推荐安装官方推荐版本)，下载地址：https://nodejs.org/zh-cn/

下载包之后傻瓜式安装，一直点击下一步操作，直至安装结束，如果不懂得可以网上搜一下nodejs安装教程

 

如何检测nodejs是否安装成功，打开cmd ， 运行如下两个命令，node -v   和 npm -v  ，如果两个都有显示ok nodejs安装完成 

 

2.程序运行之前需搭建好Server端
 

vueThink包： GitHub包
 

下载之后解压，打开cmd命令，进入到你的项目目录：frontEnd

 

然后执行： npm install    回车等待安装结束

 

项目中会生成出一个，  nodejs的运行扩展【node_modules】

然后执行：npm run dev   

 

浏览器会自动跳转，默认跳转的是 localhost：8080 ，显示如下界面恭喜你项目搭建成功

 

检测默认接口请求地址：指向你的public路径即可，如下图标识tp路由正确

 

 

更改前端配置文件，build下的webpack.base.conf.js 文件接口，此处建议本地吧上图中访问的tp路径配置个绝对路径的域名填入

 

如果想更新掉浏览器的默认访问显示localhsot:8080, 替换localhsot更改如下文件： build/dev-server.js文件

 

 

如果想更改掉，8080端口，如下

注意：前端服务启动，默认会占用8080端口，所以在启动前端服务之前，请确认8080端口没有被占用。
如果想替换前端默认端口，可修改config/index.js里面的dev对象的port参数，但不建议这么做。

 

更改之后，停掉cmd中的npm 命令，ctrl+c 两次，然后重新运行npm run dev 即可

 

 

打包发布项目

 

项目开发结束之后，执行npm命令完前端文件的打包操作

 

还是在之前的路径下，执行， npm run build 等待执行结束，会生成 dist文件，然后配置绝对路径到dist目录，在浏览器访问即可

 

转载于:https://www.cnblogs.com/LoveProgram/articles/7211470.html