前端学习（2740）：重读vue电商网站50之Element-UI 组件按需加载

 

通过 CDN 优化 ElementUI 的打包

虽然在开发阶段，我们启用了 element-ui 组件的按需加载，尽可能的减少了打包的体积，但是那些被按需加载的组件，还是占用了较大的文件体积。此时，我们可以将 element-ui 中的组件，也通过 CDN 的形式来加载，这样能够进一步减小打包后的文件体积。


具体操作流程如下：
① 在 main-prod.js 中，注释掉 element-ui 按需加载的代码
② 在 public/index.html 的头部区域中，通过 CDN 加载 element-ui 的 js 和 css 样式

Javascript

<!-- element-ui 的样式表文件 -->
<link rel="stylesheet" href="https://cdn.staticfile.org/element-ui/2.8.2/theme-
chalk/index.css" />
<!-- element-ui 的 js 文件 -->
<script src="https://cdn.staticfile.org/element-ui/2.8.2/index.js"></script>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.mzph.cn/news/414613.shtml

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

8、jeecg 笔记之 自定义word 模板导出（一）

8、jeecg 笔记之 自定义word 模板导出（一）

8、jeecg 笔记之 自定义word 模板导出&#xff08;一&#xff09; 1、前言 jeecg 中已经自带 word 的导出导出功能&#xff0c;其所使用的也是 easypoi&#xff0c;尽管所导出的 word 能满足大部分需求&#xff0c; 但总是有需要用到自定义 word导出模板&#xff0c;下文所用到…
阅读更多...
Android 全屏抽屉fragment，NavigationView

Android 全屏抽屉fragment，NavigationView

1、首先是右→左进入动画 、slide_left.xml <?xml version"1.0" encoding"utf-8"?> <set xmlns:android"http://schemas.android.com/apk/res/android"><translateandroid:duration"800"android:fromXDelta"20…
阅读更多...
Eclipse 创建第一个 springboot 应用

Eclipse 创建第一个 springboot 应用

Eclipse 创建第一个 springboot 应用 1、前言 一直想把笔记整理出来&#xff0c;分享一下 springboot 的搭建&#xff1b; 因为私下 idea 用的比较多&#xff0c;使用比较方便&#xff0c;但恰逢小伙伴问起 eclipse 怎么搭建的问题&#xff0c; 顾整理以记之。 2、springboot …
阅读更多...
Can't process attribute android:fillColor=@color/gray，添加vector属性报错解决方法

Can't process attribute android:fillColor=@color/gray，添加vector属性报错解决方法

Android studio添加vector属性文件报错 vector属性文件 <vector xmlns:android"http://schemas.android.com/apk/res/android"android:width"24dp"android:height"24dp"android:viewportHeight"49.94"android:viewportWidth"4…
阅读更多...
前端学习（2742）：重读vue电商网站52之路由懒加载

前端学习（2742）：重读vue电商网站52之路由懒加载

当打包构建项目时&#xff0c;JavaScript 包会变得非常大&#xff0c;影响页面加载。如果我们能把不同路由对应的组件分割成不同的代码块&#xff0c;然后当路由被访问的时候才加载对应组件&#xff0c;这样就更加高效了。 具体需要 3 步&#xff1a; 安装 babel/plugin-synt…
阅读更多...
Android Service与IntentService区别

Android Service与IntentService区别

相同点&#xff1a; 1、首先Service与IntentService都是Android的基本组件service 2、使用时都是一样需要创建&#xff0c;配置&#xff1b;和调用启动方式都是一样的 不同点&#xff1a; 1、IntentService是继承自Service的service 类&#xff0c;创建了自己的特有方法onH…
阅读更多...
前端学习（2743）：重读vue电商网站53之项目上线

前端学习（2743）：重读vue电商网站53之项目上线

通过 node 创建 web 服务器。开启 gzip 配置。配置 https 服务。使用 pm2 管理应用。 通过 node 创建 web 服务器 创建 node 项目&#xff0c;并安装 express&#xff0c;通过 express 快速创建 web 服务器&#xff0c;将 vue 打包生成的 dist 文件夹&#xff0c;托管为静态资…
阅读更多...
记录请求的耗时（拦截器、过滤器、aspect）

记录请求的耗时（拦截器、过滤器、aspect）

记录请求的耗时&#xff08;拦截器、过滤器、aspect&#xff09; 文章前言 记录控制器请求的耗时处理通常有三种实现方式&#xff0c;分别是&#xff1a;过滤器、拦截器、aspect&#xff1b;下文将逐一实现。 1、Filter 过滤器 1.1、方法说明 需要实现 Filter 类&#xff0c;主…
阅读更多...
7、Flutter banner_view 轮播图的使用

7、Flutter banner_view 轮播图的使用

7、Flutter banner_view 轮播图的使用 1、前言 实现轮播图&#xff0c;效果如下&#xff1a; 2、实现 将采用 banner_view 实现&#xff1a;资源库地址 2.1、yaml 引入依赖 在 pubspec.yaml 声明需要引用的库&#xff0c;执行命令 flutter packages get 进行拉取即可使用。 ba…
阅读更多...
Android 人脸实名验证demo——腾讯人脸核身·云智慧眼

Android 人脸实名验证demo——腾讯人脸核身·云智慧眼

可以说比较容易实现&#xff1a;只需要获取BizToken&#xff0c;再起调腾讯SDK即可 1、首先登录腾讯云平台&#xff0c;申请权限&#xff0c;创建应用 腾讯云&#xff1a; https://cloud.tencent.com/ 2、配置应用信息及实名验证流程设置&#xff0c;下载SDK 不过&#xff0c;…
阅读更多...
[JSOI 2015] 子集选取

[JSOI 2015] 子集选取

4475: [Jsoi2015]子集选取 Time Limit: 1 Sec Memory Limit: 512 MBSubmit: 363 Solved: 255[Submit][Status][Discuss]Description Input 输入包含一行两个整数N和K&#xff0c;1<N,K<10^9 Output 一行一个整数&#xff0c;表示不同方案数目模1,000,000,007的值。 Sam…
阅读更多...
工作242：关于第二个git仓库提交代码

工作242：关于第二个git仓库提交代码

其实第二个仓库 建立的时候直接取进行 push操作就可以完成 原理一样 可以直接对代码地址进行提交
阅读更多...
工作243：name报错

工作243：name报错

name报错就是name的数值报错
阅读更多...
Android 图片压缩，Bitmap旋转，bitmap与byte[]之间相互转换，Bitmap与String互转

Android 图片压缩，Bitmap旋转，bitmap与byte[]之间相互转换，Bitmap与String互转

频繁setImageBitmap引起oom问题解决方法 Glide.with(gsewmimg).load(getCodeBitmap(response.data.skip, R.mipmap.zhifuicon)).into(gsewmimg);压缩前后。图片大小 2.22MB——>200KB 1、图片压缩方法&#xff1a; Bitmap bitmap; byte[] buff; buff Bitmap2Bytes(bitmap…
阅读更多...
9、Flutter 实现 生成二维码

9、Flutter 实现 生成二维码

9、Flutter 实现 生成二维码 1、加入依赖 在 pubspec.yaml 中 dependencies 节点下添加&#xff1a; dependencies: qr_flutter: ^1.1.6 2、引入代码 在需要细线二维码的 dart 类中引入依赖代码包&#xff1a; import package:qr_flutter/qr_flutter.dart; 代码部分 import p…
阅读更多...
Android 换肤demo，轻量快捷接入集成，判断是否夜间模式

Android 换肤demo，轻量快捷接入集成，判断是否夜间模式

true为黑夜模式 //检查当前系统是否已开启暗黑模式 public static boolean getDarkModeStatus(Context context) {int mode context.getResources().getConfiguration().uiMode & Configuration.UI_MODE_NIGHT_MASK;return mode Configuration.UI_MODE_NIGHT_YES;} 实现…
阅读更多...
前端学习（2761）：uni-app样式的学习

前端学习（2761）：uni-app样式的学习

阅读更多...
Python——使用matplotlib绘制柱状图

Python——使用matplotlib绘制柱状图

Python——使用matplotlib绘制柱状图 1、基本柱状图 首先要安装matplotlib&#xff08;http://matplotlib.org/api/pyplot_api.html#matplotlib.pyplot.plot&#xff09; 可以使用pip命令直接安装[python] view plaincopy # -*- coding: utf-8 -*- import matplotlib.pyplot a…
阅读更多...
Android 语音播报，语音识别demo

Android 语音播报，语音识别demo

该功能是基于百度智能云实现的根据文字进行语音播报。 1、首先到百度智能云创建语音应用 https://console.bce.baidu.com/ai/ 填写包名创建百度语音应用&#xff0c;获取AppID&#xff0c;API Key&#xff0c;Secret Key 2、导入资源文件。语音jar&#xff0c;assets语音库&am…
阅读更多...
前端学习（2762）：如何使用scss

前端学习（2762）：如何使用scss

阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023