本地项目github静态展示

前提

  • 在本地npm run dev后能够在本地端口正常显示
  • githubpage为自己的静态页面

上线

  • config/index.js中设置assetsPublicPath: './',
  • build目录下utils.js中的ExtractTextPlugin.extract({}),添加下面这个属性publicPath: '../../'
  • 把通过ajax获取数据的地址改为GitHub上的json地址(把json数据上传到github,在github上打开json文件,点击raw获取地址)
  • npm run build后把dist下的文件上传到静态展示的地方,如xxx.github.io仓库里的某个文件夹(dist),使用xxx.github.io/dist即可访问

缺点

  • 有时候github不能访问或访问慢,数据获取会失败(挂代理可解决,只是为了开发展示用而已)

本地预览的vue项目,在githubpage静态展示的更多相关文章

  1. 图像本地预览插件(基于JQUERY、HTML5)

    最近是被这项目搞疯了.害我天天写插件,上周才写,现在就继续吧..... 说说这个吧.主要是用于本地图像预览的.我们知道在以前,图像预览一般都很麻烦,一般都是异步上传然后返回路径,动态设置路径,但是这样 ...

  2. 图片本地预览 flash html5

    dataURI 一种能够在页面嵌入外部资源的URI方案.能够降低图片或者样式表的http请求数量,提高效率. ie8把dataURI 的属性值限制在32k以内. 图片本地预览: 由于安全原因,通过fi ...

  3. js基础进阶--图片上传时实现本地预览功能的原理

    欢迎访问我的个人博客:http://www.xiaolongwu.cn 前言 最近在项目上加一个图片裁剪上传的功能,用的是cropper插件,注意到选择本地图片后就会有预览效果,这里整理一下这种预览效 ...

  4. JQuery插件:图片上传本地预览插件,改进案例一则。

    /* *名称:图片上传本地预览插件 v1.1 *作者:周祥 *时间:2013年11月26日 *介绍:基于JQUERY扩展,图片上传预览插件 目前兼容浏览器(IE 谷歌 火狐) 不支持safari *插 ...

  5. 图片上传-本地图片转base64+ie8支持+本地预览支持

    最近项目由于flash同学没在了,图片上传只能前端重新做,后台希望用base64数据上传,复用之前接口 问题来了, 1.ie8 不支持canvas转base64 2.本地预览 base64数据,ie8 ...

  6. IE8/9 本地预览上传图片

    本地预览的意思是,在选择图片之后先不上传到服务器,而是由一个<img>标签来预览本地的图片,非 IE8/9 浏览器可以从<input type="file"/&g ...

  7. JS代码实用代码实例(输入框监听,点击显示点击其他地方消失,文件本地预览上传)

    前段时间写前端,遇到一些模块非常有用,总结以备后用 一.input框字数监听 <!DOCTYPE html> <html lang="en"> <he ...

  8. jquery 图片本地预览

    uploadPreview.js /* *名称:图片上传本地预览插件 v1.1 *介绍:基于JQUERY扩展,图片上传预览插件 目前兼容浏览器(IE 谷歌 火狐) 不支持safari *参数说明: I ...

  9. 网站中集成jquery.imgareaselect实现图片的本地预览和选择截取

    imgAreaSelect 是由 Michal Wojciechowski开发的一款非常好用的jquery插件,实现了图片的截取功能.其文档和Demo也是很详尽的.大家可以到http://odynie ...

随机推荐

  1. Bootsrap Table表格分页

    一 bootsrap简介 Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加 ...

  2. 学习Spring.Net_1

    Spring.Net是一个轻量级的控制反转(IoC)和面向切面编程(AOP)技术的容器框架  一.控制反转(Inversion of Control,IoC),也叫依赖注入(Dependency In ...

  3. 最小白的webpack+react环境搭建

    本文也同步发表在我的公众号“我的天空” 从零开始,用最少的配置.最少的代码.最少的依赖来搭建一个最简单的webpack+react环境. 最近在玩webpack+react+移动端,那么第一步自然是搭 ...

  4. iOS 系统框架结构图

  5. 在 CentOS 上安装 vsftp 服务

    在 CentOS 上安装 vsftp 服务 1.查看当前 CentOS 服务器是否已安装了 vsftpd 服务: rpm -q vsftpd 如果打印如下类似的信息则表明已安装 vsftpd 服务: ...

  6. 移动webApp - 1像素实现(点5像素的秘密)

    在移动web项目中,经常会实现以下1像素的边框 移动web设计中,在retina显示屏下网页会由1px会被渲染为2px,那么视觉稿中1px的线条还原成网页需要css定义为0.5px 但是正当我们去用0 ...

  7. 拖拽事件--select外边框拖拽

    地图上面的搜索框要可拖拽 但是搜索框是有点击事件的,点击显隐下拉菜单,如果拖拽的事件源选择select框的话,会有样式(十字拖动符cursor:move与selelt默认点击的箭头)冲突 思索良久,就 ...

  8. Android 编码风格规范,很赞哦

    1. 前言 这份文档参考了 Google Java 编程风格规范和 Google 官方 Android 编码风格规范.该文档仅供参考,只要形成一个统一的风格,见量知其意就可. 1.1 术语说明 在本文 ...

  9. python if else while for

    1 getpass模块 设置密码不显示明文 用户名和密码输入程序: import getpass username = input("username:") password = ...

  10. jq 操作select

    添加option $("#ID option").each(function(){if($(this).val()==111){$(this).remove();}}); 移除op ...