简单介绍:MDUI[更为轻量化的 UI 框架]

引用

正如 MDUI 官方所说,MDUI 漂亮，轻量，好用，能让你轻松开发 Material Design 网页应用。MDUI 学习成本很低，只需要懂一点点 html5+css 以及 js 的基础，就能得心应手的使用

安装

MDUI 可以通过简单的 CDN 引用，整体大小 CSS 仅 32KB，JavaScript 仅 19KB，加载更迅速。

CDN:


<!-- MDUI CSS -->
<link
  rel="stylesheet"
  href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css"
  integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw"
  crossorigin="anonymous"
/>

<!-- MDUI JavaScript -->
<script
  src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js"
  integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A"
  crossorigin="anonymous"
></script>

也可以通过包管理器安装:

npm


npm install mdui --save

yarn


yarn add mdui

示例


<!doctype html>
<html lang="zh-cmn-Hans">
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, shrink-to-fit=no"/>
    <meta name="renderer" content="webkit"/>
    <meta name="force-rendering" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>

    <!-- MDUI CSS -->
    <link
      rel="stylesheet"
      href="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/css/mdui.min.css"
      integrity="sha384-cLRrMq39HOZdvE0j6yBojO4+1PrHfB7a9l5qLcmRm/fiWXYY+CndJPmyu5FV/9Tw"
      crossorigin="anonymous"
    />
    <title>Hello, world!</title>
  </head>
  <body>
    <h1>Hello, world!</h1>

    <!-- MDUI JavaScript -->
    <script
      src="https://cdn.jsdelivr.net/npm/mdui@1.0.1/dist/js/mdui.min.js"
      integrity="sha384-gCMZcshYKOGRX9r6wbDrvF+TcCCswSHFucUzUPwka+Gr+uHgjlYvkABr95TCOz3A"
      crossorigin="anonymous"
    ></script>
  </body>
</html>

参考文献

MDUI:https://www.mdui.org/

vue 项目 chunk.js 太大导致页面加载超时

[图片] 一、问题最近做了一个 vue 项目，打包后部署到 nginx，页面访问时一直停留在加载页面，浏览器调试观察到 chunk 开头的多个 js 文件加载时间超过了 30s 还没有加载完，js 文件大小有 20 多 Mb 二、解决方案 2.1 安装插件执行如下命令 npm install --save-dev ..

前端组兼容性范围

参考网站：查看浏览器占比(browserslistrc) 语法兼容性检查 CanIUse 之前基于已有项目，前端组暂定语法兼容范围为火狐 Firefox 52+ 版本谷歌 Chrome 78+ 版本但是由于部门项目碰到的一些低版本浏览器（Firefox 42.0.4）导致代码语法错误，所以要求所有 vue 项目 ..

Diss 一下前端“八股文”

现在的面试官，喜欢随便从网上抄面试题，而且还不与时俱进，在这里 Diss 一下从浏览器地址栏敲下回车到最后发生了什么答：跟日常开发毫无关系，不关心发生了什么，知道了也不会对日常开发有任何帮助谈谈浏览器运行机制答：同上 New Vue 的时候会发生什么答：会报错，因为 Vue3 已经去掉了 new API，如果 ..

2022 要结束了，读了半年书，年终上线两个网站

2022 各种奇葩，已经无法表达。可能 2023 更糟，提前做好心理准备。才知道以前读书时计算机一级没有考，成绩也查不到，为了弥补证书遗憾，今年 9 月考了二级 Web 程序设计顺利拿下，公共理论部分也算是对计算机科学的基本功的一个回顾与训练。年末了，上线两个新站点。一个是以前的一个老站的全新版本(数据迁移)，一个 ..

PNPM ，快速的，节省磁盘空间的包管理工具

PNPM ，Fast, disk space efficient package manager. [图片] 推荐语： PNPM ，快速的，节省磁盘空间的包管理工具；相比于 npm 或 yarn ，pnpm 具有以下功能特色：快速：pnpm 比其他包管理器快 2 倍；高效：node_modules 中的文件链接 ..

如何自己开发一个 Jupyter 客户端

背景想当年我就是从 Jupyter 入手了块编辑器, 之后遇到思源笔记就立刻喜欢上了思源的块编辑, 因此想方法将思源改造为 Jupyter 的客户端, 这样在思源中可以直接运行代码并将运行结果写入笔记中, 从而避免做笔记时两头切换, 详情请参考: [链接] Jupyter 管理 API Jupyter 服务, 比如内 ..

欢迎来到这里！

我们正在构建一个小众社区，大家在这里相互信任，以平等 • 自由 • 奔放的价值观进行分享交流。最终，希望大家能够找到与自己志同道合的伙伴，共同成长。

关于