经过两天的研究终于将VUE打包后的项目通过BAE发布到了网上。虽然接口方面还有一下问题但是自己还是很高兴的。

  首先说一下这个项目需要用到的技术,vue+express+git+百度的应用引擎BAE。

  继续编辑终于将自己写的JSON文件模拟的数据也传上去了。

  具体的步骤:

  1,首先讲写好的vue项目打包(具体的打包过程我就不在说了,直接npm run build,就会在VUE项目文件中重新创建一个dist文件,这个就是打包好的项目)

  

  2,在百度的应用引擎BAE部署一个项目,一天才2毛钱很便宜。自己玩很划算。

  详细的的步骤在https://cloud.baidu.com/doc/BAE/QuickGuide.html上面都有介绍,我用的GIT版本管理工具。一定要选择nodejs0.10.21-web这个类型。因为我们用的express框架。根据步骤创建好自己的库以后。先自己熟悉一下他的配置文档。

  3,在自己创建的库里面将espress安装上去,具体的步骤自己度娘。(npm install -g express-generator 这个命令一定要有,要不然可能提示express命令找不到)

接下来就是重头戏了,虽然很简单,但是我研究了半天。

(1)先将git管理的这个文件里三个文件,除了app.conf全部删掉,然后将创建的express项目中的文件复制出来放到git 管理的那个库里面,git管理的库的文件名基本上是test1\appid245yn4jb32这个样子的。test1是我创建的文件夹,appid245yn4jb32这个文件夹是git远程克隆下来的。将express创建的项目中的文件,包括依赖全部复制到appid245yn4jb32文件夹下面。同时将bin文件夹里面的www文件加上js后缀。因为这个BAE只识别.js的入口文件。同时将www文件中的端口改为18080.   因为BAE的默认端口为18080。

(2)将vue项目中打包好的项目(dist文件夹下面的所有文件)复制到public文件夹下面,将它原来的删掉。

这样将所有文件上传 ,打开网站,应该就可以看到vue项目中的东西了。(不过是没有数据的样子)

将vue的项目打包后通过百度的BAE发布到网上的流程的更多相关文章

  1. vue+webpack项目打包后背景图片加载不出来问题解决

    在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了, ...

  2. vue+elementui项目打包后样式变化问题

    博主刚刚解决了index.html空白问题,刚打开项目页面又发现了样式出现了大问题,样式与开发版本有很大不同,有些样式没有生效.利用搜索引擎,找到了问题所在以及解决办法:main.js中的引入顺序决定 ...

  3. vue项目打包后想发布在apache www/vue 目录下

    使用的是vue-element-admin做示例,可以参考Vue项目根据不同运行环境打包项目,其他项目应该大同小异. 使用vue-router的browserHistory模式,配置mode: 'hi ...

  4. vue项目打包后资源相对引用路径的和背景图片路径问题

    vue项目中若要使用相对路径来获得相应静态资源,需要修改以下内容来确保项目打包后能正常运行. 1.修改config => index.js => build => assetsPub ...

  5. vue项目打包后运行报错400如何解决

    昨天一个Vue项目打包后,今天测试,发现无论localhost还是服务器上都运行不了,报错如下: Failed to load resource: the server responded with ...

  6. vue 使用webpack打包后路径报错以及 alias 的使用

    一.vue 使用webpack打包后路径报错(两步解决) 1. config文件夹 ==> index.js ==> 把assetsPublicPath的 '/ '改为 './' 2. b ...

  7. C#项目打包后安装的桌面快捷方式图标怎么设置成自己想要的图标

    #项目打包后安装的桌面快捷方式图标怎么设置成自己想要的图标 2012-08-25 09:11匿名 | 浏览 3286 次  C#编程 C#项目用vs2005自带的工具打包后安装的桌面快捷方式图标怎么设 ...

  8. SpringBoot 项目打包后获取不到resource下资源的解决

    SpringBoot 项目打包后获取不到resource下资源的解决 在项目中有几个文件需要下载,然后不想暴露真实路径,又没有CDN,便决定使用接口的方式来获取文件.最初的时候使用了传统的方法来获取文 ...

  9. vue项目打包后一片空白及资源引入的路径报错解决办法

    网上很多说自己的VUE项目通过Webpack打包生成的list文件,放到HBulider打包后,通过手机打开一片空白.这个主要原因是路径的问题. 1.记得改一下config下面的index.js中bu ...

随机推荐

  1. js禁止滚动条移动

    js禁止滚动条移动 var scrollFunc=function(e){ e=e||window.event; if (e&&e.preventDefault){ e.prevent ...

  2. 基础知识全面LINUX

    学习Linux系统的重要性应该不用多说,下面我就对Linux的基础知识进行一个全面而又简单的总结.不过建议大家还是装个Linux系统多练习,平时最好只在Linux环境下编程,这样会大有提高. linu ...

  3. flask----flask-session

    一.flask-session flask-session是flask框架的session组件,由于原来flask内置session使用签名cookie保存,该组件则将支持session保存到多个地方 ...

  4. spring之AspectJ基于xml AOP编程

    一.引言: AspectJ框架不仅实现了面向切面编程,而且还支持注解,spring将它引入自己的规范之中. 二.需要了解: AspectJ是基于java语言的AOP框架 spring2.0之后支持As ...

  5. windows单节点下安装es集群

    linux下的es的tar包,拖到windows下,配置后,启动bin目录下的bat文件,也是可以正常运行的. 从linux下拷的tar包,需要修改虚拟机的内存elasticsearch.in.bat ...

  6. Codeforces Round #395 (Div. 2)(未完)

    2.2.2017 9:35~11:35 A - Taymyr is calling you 直接模拟 #include <iostream> #include <cstdio> ...

  7. POJ 1584 A Round Peg in a Ground Hole[判断凸包 点在多边形内]

    A Round Peg in a Ground Hole Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 6682   Acc ...

  8. http协议重点

    https://www.cnblogs.com/ranyonsue/p/5984001.html HTTP简介 HTTP协议是Hyper Text Transfer Protocol(超文本传输协议) ...

  9. Linux修改IP永久生效

    修改IP永久生效按以下方法: 1)修改配置文件vi /etc/sysconfig/network-scripts/ifcfg-eth0(eth0,第一块网卡,如果是第二块则为eth1) 按如下修改ip ...

  10. Newtonsoft.Json 操作 JSON 字符串

    Newtonsoft.Json介绍 在做开发的时候,很多数据交换都是以json格式传输的.而使用Json的时候,我们很多时候会涉及到几个序列化对象的使用:DataContractJsonSeriali ...