抓包

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. AJAX数据传输(原生js)

    原生ajax写法 <!DOCTYPE html> <html lang=""> <head> <meta charset="UT ...

  2. pip install torch出现错误

    首先使用Python的pip安装命令: pip install torch 出现错误 解决办法:这时需要先下载pytorch包,根据自己的python版本选择.pytorch包链接: https:// ...

  3. phpcms添加图片投票

    1phpcms加入投票选项的图片上传功能,从我的文件下载,然后到phpcms目录下直接覆盖即可. 当然这边出现了一个bug,修改投票选项不能修改的bug,只需要修改vote_option_class. ...

  4. OA-APP增加空间

    第一步:虚拟机增加一块200G的硬盘,使用fdisk -l 命令可以看到增加的硬盘(centos6可能需要重启系统) 第二步:然后对 /dev/sdc进行分区 第三步:创建一个分区 第四步:重新查看磁 ...

  5. 吴裕雄--天生自然python学习笔记:python设置文档的格式

    Win32com 组件可为特定范围的内 容设置格式, 较常用的格式有标题格式.对齐 方式格式及字体格式 . 许多格式使用 常量表示 , 所 以 需先导入 constants常量模块 : 设置标题格式的 ...

  6. KUKA机器人常见十大问题及解决方法

    1 开机坐标系无效 世界坐标系是以枪头为基点,在这种坐标系中,机器人所有的动作都是按照以枪头为顶点来完成移动,XYZ方向切割枪方向不改变,如果机器人在世界坐标系中移动,枪头也随着改变方向,那就是我们在 ...

  7. 使用框架结构之frameset

    首先,我希望在你的目录下,有4个网页,各自显示不同的内容. 如图所示: 1.html显示"火影忍者" 2.html显示"英雄联盟" 3.html显示" ...

  8. [LC] 246. Strobogrammatic Number

    A strobogrammatic number is a number that looks the same when rotated 180 degrees (looked at upside ...

  9. H5页面如何引入vConsole

    vConsole github地址vConsole 是腾讯开源的项目,这就简单的介绍一下使用 使用npm引入vconsole.min.js下载 vConsole 的最新版本.(不要直接下载 dev 分 ...

  10. 20180105关于课题所用的labview的改进随笔

    在原有的工程上1.写入60个不同的数字~顶层,看测量次数是1.2.3.4.5.6.7.8.9的时候文件记到几次的数,一次的话,从接受命令到全部写到文件最短需要等多久.写入固定的数,通过startfla ...