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. SpringMVC之JSON交互

    #什么是json? json是一种用于储存数据格式,是js脚本语言的子集. #json的作用? 它可以传递对象.数组等数据结构.如果是单个数据,则要用数组,不用对象,因为对象都是键值对的 方式去存储, ...

  2. centos误删mysql root用户找回办法

    一天,我进入mysql后,查看所有用户 select host,user from mysql.user; 发现好多用户名, 太乱了,删除..... delete from user where us ...

  3. Django Form&ModelForm

    ModelForm: 首先导入所需模块 from django.forms import ModelFormfrom django.forms import widgets as form_widge ...

  4. Spring Boot(十二)：spring boot如何测试打包部署

    Spring Boot(十二):spring boot如何测试打包部署 一.开发阶段 1,单元测试 在开发阶段的时候最重要的是单元测试了,springboot对单元测试的支持已经很完善了. (1)在p ...

  5. ArrayList集合、String[]数组、String字符串

    数组初始化时候必须指定长度,而ArrayList是动态数组,可以根据实际内容改变 //声明stsArr数组并初始化 String[] strArr = new String[]{ "aaa& ...

  6. mint-ui之datetime-picker使用

    一基本使用<template> <mt-datetime-picker ref="picker" type="time" v-model=&q ...

  7. stm32最简单的实现BootLoader

    BootLoader大家应该都知道是干什么的,简单的来说就是程序开始运行前的一段程序. 在成熟的产品中,通常都是采用BootLoader方式来升级产品的程序.也就是IAP升级.在了解完基本的实现原理后 ...

  8. git初学

    git在团队合作开发时是很有用的,SVN是集中式的代表,而git是分布式的代表,它分为代码区.暂存区.和本地库.在同一个团队中开发时,在代码存储中心(例如,码云.github)上创建一个库,用于储存和 ...

  9. Spring 学习——Spring JSR注解——@Resoure、@PostConstruct、@PreDestroy、@Inject、@Named

    JSR 定义:JSR是Java Specification Requests的缩写,意思是Java 规范提案.是指向JCP(Java Community Process)提出新增一个标准化技术规范的正 ...

  10. npm的安装和使用?

    参考: http://www.cnblogs.com/chyingp/p/npm.html 在css中使用变量, 采用less或sass来编译css 改变网页网站开发和构建的方式, 除了用emmet( ...