vue项目打包的时候，有的big， 超过1M,   需要进行优化，方法有：

1.  非首屏图片，可以采用懒加载的方式,  如：图片的懒加载，  vue中路由的懒加载 等

2. 各个模块， 采用如seajs（考虑中） ，按需引入

3. 如果还有很大的依赖，相对独立的包，不打包进项目，采用CDN . 如：UI 很大， 可以采用  CDN 方式加载， 减小服务器的压力， 同时还可以缩短客户端的等待时间

vue项目webpack打包后有的文件big 问题的更多相关文章

  1. vue项目 webpack打包后，图片路径是绝对路径

    vue项目,使用webpack打包,虽然在全局把路径改成了相对的路径,但是图片引用的路径还是异常的,解决办法如下: 1.config文件夹下index.js中: assetsPublicPath:&q ...

  2. 配置vue项目将打包后图片文件的引用路径改为cdn路径?

    vue cli3项目, 需求: 图片文件打包时, 将项目内的所有图片文件的引用地址改为cdn路径 vue cli3的默认配置下, 打包后图片使用的是相对路径, 例如打包后项目内图片引用路径为 img/ ...

  3. vue项目webpack打包后修改配置文件

    从webpack打包结构中我们知道,vue中有一个存放外部资源的文件夹static,它里面的文件是不会被打包编译的,所以我们就可以利用外部引入js的方式将我们的想要的数据在index.html中以js ...

  4. vue项目webpack打包后图片路径错误

    首先项目是vue-cli搭建的,项目结构如下: 然后发现在css里写的图片引用地址在开发时正常显示,但在打包扔上服务器之后报错 报的是404,路径前面多了/static/css,不知道为啥. 在自己慢 ...

  5. Vue项目的打包

    vue项目的打包 更改config文件夹下的index.js里的assetsPublicPath路径    将 “/”  改为  “./” build: { env: require('./prod. ...

  6. webpack打包vue项目之后生成的dist文件该怎么启动运行

    亲测,webpack打包vue项目之后生成的dist文件可以部署到 express 服务器上运行. 我的vue项目结构如下: 1. 进入该vue项目目录,打开git bash,执行:npm run b ...

  7. vue和webpack打包 项目相对路径修改

    一般vue使用webpack打包是整个工程的根目录,但是很多情况下都是把vue打包后的文件在某子目录下. 修改: 1,打开index.js assetsPublicPath:'/' 改为: asset ...

  8. vue项目如何打包扔向服务器

    vue项目如何打包扔向服务器   当我们将 vue 项目完成后,面临的就是如何将项目进行打包上线,放到服务器中.我使用的是 vue-cli(simple) 脚手架,所以就讲一下如何将项目进行打包,并放 ...

  9. vue之webpack打包工具的使用

    vue之webpack打包工具的使用 一.什么是webpack? webpack是一个模块打包工具.用vue项目来举例:浏览器它是只认识js,不认识vue的.而我们写的代码后缀大多是.vue的,在每个 ...

随机推荐

  1. Web开发相关笔记 #04# WebSocket

    本文的主要内容: HTTP VS. WebSocket WebSocket 的客户端实现(JavaScript) WebSocket 的服务端实现(Java & apache WebSocke ...

  2. django实现类似触发器的效果

    https://blog.csdn.net/pushiqiang/article/details/50652080?utm_source=blogxgwz1 https://blog.csdn.net ...

  3. oracle No more data to read from socket之ora-07445排查解决

    今天下午,原来一个部门的同事找过来,说有个即将上线的环境偶尔会出现 No more data to read from socket错误,版本是oracle 11.2.0.1,如下: 经查,这个问题原 ...

  4. MySql数据库表操作（二）

    一.增加表记录: insert [into] tab_name (field1,field2....) values (values1,values2....) , (values1,values2. ...

  5. BeautifulSoup 模块详解

    BeautifulSoup 模块详解 BeautifulSoup是一个模块,该模块用于接收一个HTML或XML字符串,然后将其进行格式化,之后遍可以使用他提供的方法进行快速查找指定元素,从而使得在HT ...

  6. yolo3(目标检测)实测

    yolo是继faster-r-cnn后,原作者在目标检测领域进行的新研究.到了v3版本以后,虽然已经换人支持,但是更注重工程实践,在实际使用过程中突出感受就是 “非常快”,GPU加速以后能够达到实时多 ...

  7. bzoj 2753 [SCOI 2012] 滑雪与时间胶囊 - Prim

    题目传送门 传送点I 传送点II 题目大意 给定一个有$n$个点$m$条边的图,每个点有一个高度$h_{i}$,能从$u$经过一条边到达$v$,当且仅当存在一条边是$(u, v)$或$(v, u)$, ...

  8. Actions对Element的一些操作解析

    针对Chrome浏览器: 在自动化测试的编写中如果报出Element is not visible to click at xxxx point时,我会使用: new Actions(WebDrive ...

  9. java 静态代理总结

    首先:定义一个抽象类或借口 例: package JingTai; public interface JingTai1 { public void show(); } 接着:定义一个被代理的类,他需要 ...

  10. linux内核中的PTP clock是什么?

    答: Precise Time Protocol(PTP),这是一种高精度时间同步协议,PTP是在硬件级实现的,因此需要硬件支持才能实现高精度时间同步