vue项目打包上传到百度的BAE步奏详解

这次给大家带来vue项目打包上传到百度的BAE步奏详解,vue项目打包上传到百度的BAE的上传有哪些,下面就是实战案例,一起来看一下。

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

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

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

具体的步骤:

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

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

详细的的步骤在上传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管理的库的文件名基本上是test1appid245yn4jb32这个样子的。test1是我创建的文件夹,appid245yn4jb32这个文件夹是git远程克隆下来的。将express创建的项目中的文件,包括依赖全部复制到appid245yn4jb32文件夹下面。同时将bin文件夹里面的www文件加上js后缀。因为这个BAE只识别.js的上传。同时将www文件中的端口改为18080.   因为BAE的默认端口为18080。

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

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

相信看了本文案例你已经掌握了方法,更多精彩请关注【创想鸟】其它相关文章!

推荐阅读:

上传

上传

以上就是vue项目打包上传到百度的BAE步奏详解的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/2773493.html

(0)
上一篇 2025年3月8日 13:51:35
下一篇 2025年3月8日 13:51:45

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • vue-dplayer实现hls播放的步奏详解

    这次给大家带来vue-dplayer实现hls播放的步奏详解,vue-dplayer实现hls播放的注意事项有哪些,下面就是实战案例,一起来看一下。 起因 之前写了一篇《 vue2.0+vue-video-player实现hls播放》,里边…

    编程技术 2025年3月8日
    200
  • vue全局提示框组件使用详解

    这次给大家带来vue全局提示框组件使用详解,使用vue全局提示框组件使的注意事项有哪些,下面就是实战案例,一起来看一下。 这篇文章给大家介绍一个vue全局提示框组件,具体代码如下所示: {{message}} export default …

    编程技术 2025年3月8日
    200
  • 怎样实现百度指数爬虫功能

    这次给大家带来怎样实现百度指数爬虫功能,实现百度指数爬虫功能的注意事项有哪些,下面就是实战案例,一起来看一下。 之前看过一篇脑洞大开的文章,介绍了各个大厂的前端反爬虫技巧,但也正如此文所说,没有100%的反爬虫方法,本文介绍一种简单的方法,…

    编程技术 2025年3月8日
    200
  • vue better-scroll的滚动插件使用详解

    这次给大家带来vue better-scroll的滚动插件使用详解,使用vue better-scroll的滚动插件的注意事项有哪些,下面就是实战案例,一起来看一下。 BetterScroll号称目前最好用的移动端滚动插件,因此它的强大之处…

    编程技术 2025年3月8日
    200
  • JS的数组使用详解

    这次给大家带来JS的数组使用详解,JS数组使用的注意事项有哪些,下面就是实战案例,一起来看一下。 现在很多刚开始认识js的人都不是很清楚js数组是什么,js数组是怎么定义的,下面文章就给大家介绍下对于js数组的定义,对此感兴趣的下面一起来了…

    编程技术 2025年3月8日
    200
  • vue中slot与slot-scope使用步奏详解

    这次给大家带来vue中slot与slot-scope使用步奏详解,vue中slot与slot-scope使用的注意事项有哪些,下面就是实战案例,一起来看一下。 本文介绍了vue中slot与slot-scope的具体使用教程,有需要的朋友快来…

    编程技术 2025年3月8日
    200
  • 实现react服务器渲染的步奏详解

    这次给大家带来实现react服务器渲染的步奏详解,实现react服务器渲染的注意事项有哪些,下面就是实战案例,一起来看一下。 这篇文章介绍了从零开始最小实现react服务器渲染的教程,希望能帮助到大家。 最近在写 koa 的时候想到,如果我…

    编程技术 2025年3月8日
    200
  • Angular17里的自定义指令使用详解

    这次给大家带来Angular17里的自定义指令使用详解,使用Angular17里自定义的注意事项有哪些,下面就是实战案例,一起来看一下。 1 什么是HTML   HTML文档就是一个纯文本文件,该文件包含了HTML元素、CSS样式以及Jav…

    编程技术 2025年3月8日
    200
  • Swiper里自定义分页器使用步奏详解

    这次给大家带来Swiper里自定义分页器使用步奏详解,使用Swiper里自定义分页器的注意事项有哪些,下面就是实战案例,一起来看一下。 HTML DEMO(官网例子) Slide 1 Slide 2 Slide 3 登录后复制 1.设置导航…

    编程技术 2025年3月8日
    200
  • Vue过滤器filters使用详解

    这次给大家带来Vue过滤器filters使用详解,Vue过滤器filters使用的注意事项有哪些,下面就是实战案例,一起来看一下。 示例代码 采用vue单文件组件,使用moment插件格式化日期 {{date | dateFormat}} …

    编程技术 2025年3月8日
    200

发表回复

登录后才能评论