Installations
npm install @aleen42/layui-srcDeveloper Guide
Typescript
No
Module System
CommonJS
Node Version
16.12.0
NPM Version
8.1.0
Score
79.4
Supply Chain
99.2
Quality
75
Maintenance
100
Vulnerability
100
License
Releases
Contributors
Unable to fetch Contributors
Languages
JavaScript (82.71%)
CSS (17.29%)
Developer
Download Statistics
Total Downloads
1,357
Last Day
3
Last Week
6
Last Month
44
Last Year
945
GitHub Statistics
29,924 Stars
2,357 Commits
7,403 Forks
943 Watching
3 Branches
59 Contributors
Maintainers
Package Meta Information
Latest Version
2.3.0
Package Id
@aleen42/layui-src@2.3.0
Unpacked Size
10.49 MB
Size
3.01 MB
File Count
952
NPM Version
8.1.0
Node Version
16.12.0
Total Downloads
Cumulative downloads
Total Downloads
1,357
Last day
0%
3
Compared to previous day
Last week
-62.5%
6
Compared to previous week
Last month
-20%
44
Compared to previous month
Last year
361%
945
Compared to previous year
Daily Downloads
Weekly Downloads
Monthly Downloads
Yearly Downloads
Classic modular front-end UI framework
layui 是一款采用自身模块规范编写的情怀型前端UI框架，遵循原生HTML/CSS/JS的书写与组织形式，门槛极低，拿来即用。其外在极简，却又不失饱满的内在，体积轻盈，组件丰盈，从核心代码到API的每一处细节都经过精心雕琢，非常适合界面的快速开发。layui 首个版本发布于2016年金秋，她区别于那些基于MVVM底层的UI框架，却并非逆道而行，而是信奉返璞归真之道。准确地说，她更多是为服务端程序员量身定做，你无需涉足各种前端工具的复杂配置，只需面对浏览器本身，让一切你所需要的元素与交互，从这里信手拈来。
返璞归真
layui 定义为“经典模块化”，并非是自吹她自身有多优秀，而是有意避开当下JS社区的主流方案，试图以最简单的方式去诠释高效！她的所谓经典，是在于对返璞归真的执念，她以当前浏览器普通认可的方式去组织模块！我们认为，这恰是符合当下国内绝大多数程序员从旧时代过渡到未来新标准的最佳指引。所以 layui 本身也并不是完全遵循于AMD时代，准确地说，她试图建立自己的模式，所以你会看到：
1//layui模块的定义 2layui.define([mods], function(exports){ 3 4 //…… 5 6 exports('mod', api); 7}); 8 9//layui模块的使用 10layui.use(['mod1', 'mod2'], function(args){ 11 var mod = layui.mod1; 12 13 //…… 14 15});
没错，她具备AMD的影子，又并非受限于commonjs的那些条条框框，layui 认为这种轻量的组织方式，比WebPack更符合绝大多数场景。所以她坚持采用经典模块化，也正是能让人避开工具的复杂配置，回归简单，安静高效地撸一会原生态的HTML、CSS、JavaScript。
但是 layui 又并非是Requirejs那样的模块加载器，而是一款UI解决方案，她与Bootstrap最大的不同恰恰在于她糅合了自身对经典模块化的理解。
快速上手
获得 layui 后，将其完整地部署到你的项目目录（或静态资源服务器），你只需要引入下述两个文件：
./layui/css/layui.css
./layui/layui.js //提示：如果是采用非模块化方式（最下面有讲解），此处可换成：./layui/layui.all.js
不用去管其它任何文件。因为他们（比如各模块）都是在最终使用的时候才会自动加载。这是一个基本的入门页面：
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 6 <title>开始使用layui</title> 7 <link rel="stylesheet" href="../layui/css/layui.css"> 8</head> 9<body> 10 11<!-- 你的HTML代码 --> 12 13<script src="../layui/layui.js"></script> 14<script> 15//一般直接写在一个js文件中 16layui.use(['layer', 'form'], function(){ 17 var layer = layui.layer 18 ,form = layui.form; 19 20 layer.msg('Hello World'); 21}); 22</script> 23</body> 24</html>
如果你想采用非模块化方式（即所有模块一次性加载，尽管我们并不推荐你这么做），你也可以按照下面的方式使用：
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"> 6 <title>非模块化方式使用layui</title> 7 <link rel="stylesheet" href="../layui/css/layui.css"> 8</head> 9<body> 10 11<!-- 你的HTML代码 --> 12 13<script src="../layui/layui.all.js"></script> 14<script> 15//由于模块都一次性加载，因此不用执行 layui.use() 来加载对应模块，直接使用即可： 16;!function(){ 17 var layer = layui.layer 18 ,form = layui.form; 19 20 layer.msg('Hello World'); 21}(); 22</script> 23</body> 24</html>
阅读文档
从现在开始，尽情地拥抱 layui 吧！但愿她能成为你长远的开发伴侣，化作你方寸屏幕前的亿万字节！
相关
No vulnerabilities found.
Reason
30 commit(s) and 21 issue activity found in the last 90 days -- score normalized to 10
Reason
no dangerous workflow patterns detected
Reason
no binaries found in the repo
Reason
license file detected
Details
- Info: project has a license file: LICENSE:0
- Info: FSF or OSI recognized license: MIT License: LICENSE:0
Reason
0 existing vulnerabilities detected
Reason
packaging workflow detected
Details
- Info: Project packages its releases by way of GitHub Actions.: .github/workflows/release-npm.yml:9
Reason
Found 20/30 approved changesets -- score normalized to 6
Reason
security policy file detected
Details
- Info: security policy file detected: SECURITY.md:1
- Warn: no linked content found
- Info: Found disclosure, vulnerability, and/or timelines in security policy: SECURITY.md:1
- Info: Found text in security policy: SECURITY.md:1
Reason
no effort to earn an OpenSSF best practices badge detected
Reason
detected GitHub workflow tokens with excessive permissions
Details
- Info: topLevel 'contents' permission set to 'read': .github/workflows/issue-close-require.yml:8
- Warn: no topLevel permission defined: .github/workflows/issue-closed.yml:1
- Info: topLevel 'contents' permission set to 'read': .github/workflows/issue-labeled.yml:8
- Info: topLevel 'contents' permission set to 'read': .github/workflows/issue-opened.yml:8
- Warn: no topLevel permission defined: .github/workflows/pr-preview.yml:1
- Warn: no topLevel permission defined: .github/workflows/release-npm.yml:1
- Warn: no topLevel permission defined: .github/workflows/release.yml:1
- Info: no jobLevel write permissions found
Reason
Project has not signed or included provenance with any releases.
Details
- Warn: release artifact v2.9.21 not signed: https://api.github.com/repos/layui/layui/releases/193027645
- Warn: release artifact v2.9.21-rc.3 not signed: https://api.github.com/repos/layui/layui/releases/192705985
- Warn: release artifact v2.9.21-rc.2 not signed: https://api.github.com/repos/layui/layui/releases/192649878
- Warn: release artifact v2.9.21-rc.1 not signed: https://api.github.com/repos/layui/layui/releases/192298235
- Warn: release artifact v2.9.21-rc not signed: https://api.github.com/repos/layui/layui/releases/191954739
- Warn: release artifact v2.9.21 does not have provenance: https://api.github.com/repos/layui/layui/releases/193027645
- Warn: release artifact v2.9.21-rc.3 does not have provenance: https://api.github.com/repos/layui/layui/releases/192705985
- Warn: release artifact v2.9.21-rc.2 does not have provenance: https://api.github.com/repos/layui/layui/releases/192649878
- Warn: release artifact v2.9.21-rc.1 does not have provenance: https://api.github.com/repos/layui/layui/releases/192298235
- Warn: release artifact v2.9.21-rc does not have provenance: https://api.github.com/repos/layui/layui/releases/191954739
Reason
dependency not pinned by hash detected -- score normalized to 0
Details
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-close-require.yml:18: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-close-require.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-close-require.yml:26: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-close-require.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-close-require.yml:32: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-close-require.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/issue-closed.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-closed.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-labeled.yml:25: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-labeled.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-labeled.yml:36: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-labeled.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-labeled.yml:47: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-labeled.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-labeled.yml:61: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-labeled.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/issue-labeled.yml:74: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-labeled.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/issue-opened.yml:24: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/issue-opened.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/pr-preview.yml:10: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/pr-preview.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/pr-preview.yml:13: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/pr-preview.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release-npm.yml:12: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/release-npm.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release-npm.yml:13: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/release-npm.yml/main?enable=pin
- Warn: GitHub-owned GitHubAction not pinned by hash: .github/workflows/release.yml:14: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/release.yml/main?enable=pin
- Warn: third-party GitHubAction not pinned by hash: .github/workflows/release.yml:74: update your workflow using https://app.stepsecurity.io/secureworkflow/layui/layui/release.yml/main?enable=pin
- Warn: npmCommand not pinned by hash: .github/workflows/pr-preview.yml:19
- Info: 0 out of 7 GitHub-owned GitHubAction dependencies pinned
- Info: 0 out of 9 third-party GitHubAction dependencies pinned
- Info: 0 out of 1 npmCommand dependencies pinned
Reason
project is not fuzzed
Details
- Warn: no fuzzer integrations found
Reason
SAST tool is not run on all commits -- score normalized to 0
Details
- Warn: 0 commits out of 20 are checked with a SAST tool
Score
5.5
/10
Last Scanned on 2025-01-27
The Open Source Security Foundation is a cross-industry collaboration to improve the security of open source software (OSS). The Scorecard provides security health metrics for open source projects.
Learn More