element-ui 本地化使用教程详解


Posted in Javascript onOctober 28, 2019

起因:

用 element-ui 时,本人是没有安装其它环境,而是直接用链接引入,这个带来的问题是,每次打开网页都很慢,于是想本地化,但是发现只是下载两个引入的 js 和 css 是不够的,很多功能会无法使用,打开 DevTools 发现是还有别的资源本地没有。

element-ui 本地化使用教程详解

再次前往官网,找到下载页面,结果发现并没有给直接的下载链接。。没办法了,自己写个脚本来下载。最后成功离线化。

下载后在 html 中引入:

<!--<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css">-->
<link rel="stylesheet" href="element-ui/lib/theme-chalk/index.css" rel="external nofollow" >

<!--<script src="https://unpkg.com/element-ui/lib/index.js"></script>-->
<script src="element-ui/lib/index.js"></script>

element-ui 本地化使用教程详解

下载脚本:

临时起意做的,代码里面可能会有些瑕疵,但是不影响使用,本人已经成功下载并使用。
路径可以自己更改,注意不要从 Windows 资源管理器复制,Linux 系统当我没说。

package com.ycr;

import java.io.File;
import java.io.FileOutputStream;
import java.io.InputStream;
import java.net.HttpURLConnection;
import java.net.URL;
import java.nio.charset.StandardCharsets;
import java.util.ArrayList;

public class Main {
 static String fileP = "C:\\Users\\YCR\\Desktop\\element-ui\\"; // 不要从资源管理器复制,有的字符会有问题,导致无法创建文件
 static String urlP = "https://unpkg.com/browse/element-ui@2.12.0/";
 static String urlF = "https://unpkg.com/element-ui@2.12.0/";
 public static void main(String[] args){
 try {
  GetPage("");
 } catch (Exception e) {
  e.printStackTrace();
 }
 }
 static void GetPage(String after) throws Exception {
 System.out.println(urlP + after);
 new File(fileP + after).mkdir();
 HttpURLConnection http = (HttpURLConnection) (new URL(urlP + after)).openConnection();
 http.setRequestMethod("GET");
 http.setRequestProperty("User-Agent", "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3562.0 Safari/537.36");
 http.connect();
 if(http.getResponseCode() == 200) {
      InputStream inputStream = http.getInputStream();
      byte [] buffer = new byte[1024];
      ArrayList<byte []> byteList = new ArrayList<>();
      ArrayList<Integer> byteLength = new ArrayList<>();
      int length;
      int totalLength = 0;
      while( (length = inputStream.read(buffer)) != -1 ) {
       byteList.add(buffer);
       byteLength.add(length);
       totalLength += length;
       buffer = new byte[1024];
      }
      http.disconnect();
      byte [] all;
      all = new byte[totalLength];
      totalLength = 0;
      while(byteList.size() != 0) {
       System.arraycopy(byteList.get(0), 0, all, totalLength, byteLength.get(0));
       totalLength += byteLength.get(0);
       byteList.remove(0);
       byteLength.remove(0);
      }
      String content = new String(all, StandardCharsets.UTF_8);
      all = null;
      content = content.split("tbody")[1];
      String [] us = content.split("href=\"");
      for(int i = 1; i < us.length; i ++) {
       String href = us[i].split("\"", 2)[0];
       if(href.equals("../")) {
      continue;
     }
       if(href.charAt(href.length() - 1) == '/') {
       GetPage(after + href);
       } else {
       GetFile(after + href);
       }
      }
    } else {
  GetPage(after);
 }
 }
 static void GetFile(String url) throws Exception{
 System.out.println(url);
 HttpURLConnection http;
 http = (HttpURLConnection) (new URL(urlF + url)).openConnection();
 http.setRequestMethod("GET");
 http.setRequestProperty("User-Agent", "Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/71.0.3562.0 Safari/537.36");
 http.connect();
 if(http.getResponseCode() == 200) {
      InputStream inputStream = http.getInputStream();
      byte [] buffer = new byte[1024];
      ArrayList<byte []> byteList = new ArrayList<>();
      ArrayList<Integer> byteLength = new ArrayList<>();
      int length;
      int totalLength = 0;
      while( (length = inputStream.read(buffer)) != -1 ) {
       byteList.add(buffer);
       byteLength.add(length);
       totalLength += length;
       buffer = new byte[1024];
      }
      http.disconnect();
      byte [] all;
      all = new byte[totalLength];
      totalLength = 0;
      while(byteList.size() != 0) {
       System.arraycopy(byteList.get(0), 0, all, totalLength, byteLength.get(0));
       totalLength += byteLength.get(0);
       byteList.remove(0);
       byteLength.remove(0);
      }
      File f = new File(fileP + url.replaceAll("/", "\\\\"));
      f.createNewFile();
      FileOutputStream fos = new FileOutputStream(f, false);
      fos.write(all);
      fos.flush();
      fos.close();
 } else {
  GetFile(url);
 }
 }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
传智播客学习之java 反射
Nov 22 Javascript
Pro JavaScript Techniques学习笔记
Dec 28 Javascript
jQuery+css+html实现页面遮罩弹出框
Mar 21 Javascript
JS实现根据出生年月计算年龄
Jan 10 Javascript
js清空form表单中的内容示例
May 20 Javascript
10个JavaScript中易犯小错误
Feb 14 Javascript
js如何准确获取当前页面url网址信息
Sep 13 Javascript
Boostrap入门准备之border box
May 09 Javascript
js 函数式编程学习笔记
Mar 25 Javascript
Angular6 发送手机验证码按钮倒计时效果实现方法
Jan 08 Javascript
利用Webpack实现小程序多项目管理的方法
Feb 25 Javascript
JavaScript 作用域实例分析
Oct 02 Javascript
vue 全局环境切换问题
Oct 27 #Javascript
vue 父组件通过v-model接收子组件的值的代码
Oct 27 #Javascript
解决包含在label标签下的checkbox在ie8及以下版本点击事件无效果兼容的问题
Oct 27 #Javascript
Vue-Cli项目优化操作的实现
Oct 27 #Javascript
layui table 复选框跳页后再回来保持原来选中的状态示例
Oct 26 #Javascript
Layui 解决表格异步调用后台分页的问题
Oct 26 #Javascript
Layui实现数据表格默认全部显示(不要分页)
Oct 26 #Javascript
You might like
利用PHP生成静态HTML文档的原理
2012/10/29 PHP
PHP递归返回值时出现的问题解决办法
2013/02/19 PHP
php封装的page分页类完整实例代码
2020/02/01 PHP
基于jQuery的星级评分插件
2011/08/12 Javascript
JS中判断JSON数据是否存在某字段的方法
2014/03/07 Javascript
JS中怎样判断undefined(比较不错的方法)
2014/03/27 Javascript
window.onload与$(document).ready()的区别分析
2015/05/30 Javascript
JS实现的简单鼠标跟随DiV层效果完整实例
2015/10/31 Javascript
轻松实现js图片预览功能
2016/01/18 Javascript
原生js编写autoComplete插件
2016/04/13 Javascript
AngularJs bootstrap搭载前台框架——准备工作
2016/09/01 Javascript
webpack配置导致字体图标无法显示的解决方法
2018/03/06 Javascript
jQuery 点击获取验证码按钮及倒计时功能
2018/09/20 jQuery
layui table动态表头 改变表格头部 重新加载表格的方法
2019/09/21 Javascript
layer插件实现在弹出层中弹出一警告提示并关闭弹出层的方法
2019/09/24 Javascript
[02:33]DOTA2亚洲邀请赛趣味视频之吐真话筒
2018/03/31 DOTA
Python修改Excel数据的实例代码
2013/11/01 Python
Python打印scrapy蜘蛛抓取树结构的方法
2015/04/08 Python
pygame学习笔记(5):游戏精灵
2015/04/15 Python
在Windows中设置Python环境变量的实例讲解
2018/04/28 Python
django初始化数据库的实例
2018/05/27 Python
Python matplotlib生成图片背景透明的示例代码
2019/08/30 Python
python字符串的拼接方法总结
2019/11/18 Python
详解Python中字符串前“b”,“r”,“u”,“f”的作用
2019/12/18 Python
Pytorch Tensor基本数学运算详解
2019/12/30 Python
python GUI库图形界面开发之PyQt5多行文本框控件QTextEdit详细使用方法实例
2020/02/28 Python
Django数据统计功能count()的使用
2020/11/30 Python
澳大利亚小众服装品牌:Maurie & Eve
2018/03/27 全球购物
岗位职责定义及内容
2013/11/08 职场文书
物流管理专业应届生求职信
2013/11/21 职场文书
小学生寒假家长评语
2014/04/16 职场文书
2014年教师节演讲稿
2014/09/03 职场文书
小学生差生评语
2014/12/29 职场文书
社区党支部承诺书
2015/04/29 职场文书
家庭暴力离婚起诉书
2015/05/18 职场文书
python爬取企查查企业信息之selenium自动模拟登录企查查
2021/04/08 Python