抓包

Fiddler

一、解决跨域

proxyTable(查看博客总结)

二、解决用本机ip地址不能访问

在dev中加上 --host 0.0.0.0就可以用本机ip访问,这样的话可以用手机在内网(局域网)里通过这个ip地址访问测试我们的网页

三、解决A/B/C拖动整个页面跟随拖动问题

四、有的手机打开页面是白屏

可能是因为不支持promise,解决这个问题,a.安装 npm install babel-polyfill --save

b.在main.js中引入这个包

c.如果手机还出现白屏问题,那可能跟webpack中dev-server有关系,这时候要发布后的准生产环境测试。

五、打包上线

a.在命令行输入npm run build进行打包

b.打包完成后,根文件夹下会有一个dist文件夹,这个文件夹中的代码就是最终要上线的代码

c.项目放到后端服务器,解决路径配置问题,在配置文件中,找到build(打包配置项),配置     访问路径。把dist文件夹改名为project文件夹,直接放到后端服务器的根目录。就可以通过对应的目录访问

六、异步组件实现按需加载

js文件夹中有三个有用的文件

manifest.js--->webpack打包生成的配置文件

vendor.js--->各个组件各个页面公用的代码

app.js---->项目各个页面的业务逻辑代码

是需要什么,再加载什么,拆分的是app.js

以前直接使用

异步组件加载

只要是组件都可以进行异步加载,比如图

第十章、Vue项目的联调上线的更多相关文章

  1. vue项目 打包部署上线

    1. npm run dev:本地开发的时候做调试用的. 2. npm run build:打包部署上线,生成一个 dist 文件夹. 注意:用 npm run build 时,常遇到因引用路径不对导 ...

  2. part11 Vue项目接口联调//真机测试

    何为项目接口联调? 前端代码编译好了  后端接口写好了 我们就需要去掉前端模拟数据干掉 用后端提供的数据.进行前后端的一个调试 如何联调? config目录下面 index.js 文件 dev 中pr ...

  3. vue项目优化与上线

    一.项目优化策略 1.生成打包报告 2.第三方库启用CDN 3.Element-ui组件按需加载 4.首页内容定制 5.路由懒加载 1.生成打包报告 1.1通过vue-cli的UI面板直接查看 1.2 ...

  4. Vue 项目打包和上线

    1.把绝对路径改为相对路径 我们打开config/index.js 会看到一个build属性,这里就我们打包的基本配置了.你在这里可以修改打包的目录,打包的文件名.最重要的是一定要把绝对目录改为相对目 ...

  5. vue项目部署上线

    前言 今天把自己写的demo登录写完了,就想着试着走一下部署上线的流程.参考了很多的文档,终于成功进行了部署.在这里将服务器的搭建和vue项目的 部署上线进行整理(都是基础的知识,希望对大家有帮助.对 ...

  6. 介绍vue项目中的axios请求(get和post)

    一.先安装axios依赖,还有qs依赖 npm install axios --save npm install qs --save qs依赖包用post请求需要用到的 插入一个知识点: npm in ...

  7. vue项目配置Mock.js

    扯在前面 最近一直在忙跳槽的事情,博客也好久没有更新了,上次更新还是去年,不出意外的话,从今天起继续今年的博客之旅. 今天继续完善我之前的项目架构,从零开始搭建vue移动端项目到上线,有需要的同学可以 ...

  8. 简单vue项目脚手架(vue+webpack2.0+vuex+vue-router)

    github地址 使用技术栈 webpack(^2.6.1) webpack-dev-server(^2.4.5) vue(^2.3.3) vuex(^2.3.1) vue-router(^2.5.3 ...

  9. 如何快速把 Vue 项目升级到 webpack3

    由于 webpack3升级后,新增了 Scope Hositing(作用域提升) 功能,据说是对 js的性能提升很大.因此,我们做了一个测试对比,就是 webpack3和 webpack1/2 的性能 ...

随机推荐

  1. 深入JVM内核--常用JVM配置参数

    Trace跟踪参数 -verbose:gc -XX:+printGC 可以打印GC的简要信息 [GC 4790K->374K(15872K), 0.0001606 secs] [GC 4790K ...

  2. async包 ES6 async/await的区别

    最基本的async 包 ApCollection.find({}).toArray(function (err, aps) { var num = 0; async.whilst( function ...

  3. 对《java程序员上班那点事》笔者对数组占用内存质疑

    1.<java程序员上班那点事>笔者对数组占用内存的描述 2.实际测试情况: /** * 测试一维数组占用内存 */ public static void testOneArray() { ...

  4. supervised learning|unsupervised learning

    监督学习即是supervised learning,原始数据中有每个数据有自己的数据结构同时有标签,用于classify,机器learn的是判定规则,通过已成熟的数据training model达到判 ...

  5. 链终止法|边合成边测序|Bowtie|TopHat|Cufflinks|RPKM|FASTX-Toolkit|fastaQC|基因芯片|桥式扩增|

    生物信息学 Sanger采用链终止法进行测序 带有荧光基团的ddXTP+其他四种普通的脱氧核苷酸放入同一个培养皿中,例如带有荧光基团的ddATP+普通的脱氧核苷酸A.T.C.G放入同一个培养皿,以此类 ...

  6. 孙鑫VC视频教程观看记录

    01: 了解了SDK编程,消息队列,消息响应,消息循环,窗口函数等. 02: 可以冒号:父类构造函数和a(1) protected子类可以访问 覆盖:父类子类之间   重载:同一个类中 ::作用域标识 ...

  7. django Highcharts制作图表--显示CPU使用率

    Highcharts 是一个用纯JavaScript编写的一个图表库. Highcharts 能够很简单便捷的在web网站或是web应用程序添加有交互性的图表 Highcharts 免费提供给个人学习 ...

  8. 当iPhone用上联发科,你还会爱上它吗?

    ​ ​ 对于苹果来说,现在正在经历史上罕见的"冰火两重天"境遇.一方面是iPhone 8系列的售价以让人瞠目结舌的速度暴跌,另一方面则是史上售价最高的iPhone X遭遇疯抢,销量 ...

  9. 千亿VR市场 将被国内厂商玩坏多少?

    将被国内厂商玩坏多少?" title="千亿VR市场 将被国内厂商玩坏多少?"> 智能硬件行业在不断寻求新的突破口,当智能手机.平板.电视.家电等都司空见惯之后,能 ...

  10. 海洋深处的数据中心——微软Natick项目

    数据中心(data center)是云计算的支柱,云计算的蓬勃发展离不开数据中心在建造运营方面的不断创新.但云端数据中心的运行过程中会产生大量热量,冷却降温过程则意味着巨大的能源消耗,这意味着需要庞大 ...