大家知道,golang开发的东西部署简单是它很大的卖点,一般的应用,生成的可执行文件直接放服务器上运行即可,不需要任何环境。当然,大型的应用才需要比如mysql,nginx等。
但是当vue.js出现后,前端几乎都是它(vue.js)的天下了,因为用了vue.js就回不去了,无法再回到beego的view里写tpl或html页面了,很受伤,没办法,vue.js实在太方便了,所谓双向绑定,这是神马概念,百度吧,我也讲不清楚……

之前很懵逼,将vue.js开发的前端,完完全全独立地部署在云上(用nginx作为前端静态服务器,配置一堆,完全没必要),很傻很傻,其实,将vue.js打包的东西放beego的view文件夹下和static文件夹下即可……

自己的认识:

开发的时候一定要用独立的前端,即vue.js前端项目必须是独立的,独立的服务,不要放beego里的view里作为tpl页面。虽然,放beego view里的tpl通过引用vue、element、axios等似乎可以实现不少功能,但是很虐心,不到万不得已不要再去尝试,原因之一当然是没有任何教程和现成的案例是这样搞的,好多东西需要去试验。比如axios,路由啊之类。

当独立搭建起nodejs和vue的环境后,使用淘宝镜像,初始化一个项目,然后各种抄网络代码,行如流水,很顺了。

独立开发好vue.js项目后,打包后就可以放beego里面了。

部署的时候就简单了:

1.在vue.js里,cnpm run build打包,得到dist文件夹,里面有index.html和static文件夹。
2.直接将index.html放到beego的view文件夹下,然后在beego的route里和controllers里加上路由,指向这个index.html即可访问了。
3.进入dist文件夹下static文件夹内,拷贝里面所有文件和文件夹,在来到beego的static文件夹,粘贴,有相同的,则合并文件夹。
4.输入路由,就可以访问了。

原理其实就是利用go语言的静态服务功能。

beego+vue.js分离开发,结合发布,简单部署的更多相关文章

  1. 分享Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站

    这是个什么的项目? 使用 Node.js + Koa2 + MySQL + Vue.js 实战开发一套完整个人博客项目网站. 博客线上地址:www.boblog.com Github地址:https: ...

  2. vue.js 2.0实现的简单分页

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8" /> <title&g ...

  3. 一个简单的Vue.js组件开发示例

    //创建属于自己的vue组件库 (function(Vue, undefined) { Vue.component("my-component", { template: '< ...

  4. 基于webpack和vue.js搭建开发环境

    前言 在对着产品高举中指怒发心中之愤后,真正能够解决问题的是自身上的改变,有句话说的好:你虽然改变不了全世界,但是你有机会改变你自己.秉承着“不听老人言,吃亏在眼前”的优良作风,我还是决定玩火自焚. ...

  5. vue组件从开发到发布

    组件化是前端开发非常重要的一部分,从业务中解耦出来,可以提高项目的代码复用率.更重要的是我们还可以打包发布,俗话说集体的力量是伟大的,正因为有许许多多的开源贡献者,才有了现在的世界. 不想造轮子的工程 ...

  6. 基于vue的脚手架开发与发布到npm仓库

    什么是脚手架 在项目比较多而且杂的环境下,有时候我们想统一一下各个项目技术栈或者一些插件/组件的封装习惯,但是每次从零开发一个新项目的时候,总是会重复做一些类似于复制粘贴的工作,这是一个很头疼的事情, ...

  7. vue.js应用开发笔记

    看vue.js有几天了,之前也零零散散的瞅过,不过一直没有动手去写过demo,这几天后台事比较少,一直在讨论各种需求(其实公司对需求还是比较重视与严谨的,一个项目需求讨论就差不多一周了,这要搁之前,天 ...

  8. vue.js几行实现的简单的todo list

    序:目前前端框架如:vue.react.angular,构建工具fis3.gulp.webpack等等...... 可谓是五花八门,层出不穷,眼花缭乱...其实吧只要你想玩还是可以玩玩的..下面是看了 ...

  9. vue.js的学习中的简单案例

    今天学习了近年来挺火的一门JS技术,叫vue.js下面是它的一个简单案例: <html> <head> <title>$Title$</title> / ...

随机推荐

  1. HoloLens开发手记-凝视 Gaze

    在全息应用中,凝视是第一种输入形式,被用于定位物体(功能和PC的光标指针类似).凝视告诉你用户正在看向世界中的位置,让你能够确定他们的意图.在现实世界中,你通常会盯着你打算与之交互的物体.这种方式与凝 ...

  2. HoloLens开发手记-全息Hologram

    HoloLens使我们可以通过周边世界的光线和声音来创建全息场景和物体,使得它们像真实物体那样.全息场景能够响应你的凝视.手势和语音指令,同时还会和你周边世界的表面交互.借助全息场景,你可以在周边世界 ...

  3. Liferay7 BPM门户开发之7: Activiti中的重要概念和主要数据库结构

    流程的人员参与角色: Assignee :签收者(即待办人) Candidate:候选人 Owner:拥有者 Starter:启动者 participant:参与者,包含查阅 流程变量的类型: Str ...

  4. HW2017笔试编程题

    一.写一个转换字符串的函数 1.题目描述 将输入字符串中下标为偶数的字符连成一个新的字符串输出,需要注意两点: (1)如果输入字符串的长度超过20,则转换失败,返回“ERROR!”字符串: (2)输入 ...

  5. SpringBoot之OAuth2.0学习之客户端快速上手

    2.1.@EnableOAuth2Sso 这个注解是为了开启OAuth2.0的sso功能,如果我们配置了WebSecurityConfigurerAdapter,它通过添加身份验证过滤器和身份验证(e ...

  6. 第四章:Android架构

    我们对android有了个大致的了解,知道如何搭建android的环境及简单地写一个HelloWorld程序,而且知道一个android项目包括哪些文件夹和文件及相应的作用.本篇将站在顶级的高度——架 ...

  7. underscore.js源码解析【对象】

    // Object Functions // ---------------- // Keys in IE < 9 that won't be iterated by `for key in . ...

  8. Docker容器绑定外部IP和端口

    Docker允许通过外部访问容器或者容器之间互联的方式来提供网络服务. 以下操作通过myfirstapp镜像模拟,如何制作myfirstapp镜像请点击此处. 1.外部访问容器容器启动之后,容器中可以 ...

  9. Angular2入门:TypeScript的类 - 定义、继承和作用域

    一.定义和继承 二.public.private和protected

  10. vmware--查看链接克隆依赖关系

    我们都知道,虚拟机克隆有完全克隆和链接克隆两种克隆方式.当根据模版去链接克隆出很多机器时,时间一长或者把克隆后的机器改名了,我们就忘记了哪台机器是克隆出来的,哪台是直接装的.如果不小心把模版机器给删除 ...