Layui: a browser-native UI component library for people who are not front-end specialists

The gap Layui fills, and the developers it is written for

Layui describes itself as a Web UI component library built on "纯原生态的 HTML CSS JavaScript 开发模式", a plain browser development model. The README states its purpose directly: it lowers the barrier for non-front-end developers who need to build complex page interfaces. That audience matters. If you write server-side code and need a data table, a date picker, a modal layer and a form layout on the same afternoon, you are the target user. You are not expected to configure a bundler, learn a component lifecycle, or keep a virtual DOM in your head.

The README is unusually candid about where this places the project. In a section titled 破旧立新, it recounts that a 2021 announcement about the original site going offline led people to believe Layui had stopped being updated, and that the project continued on GitHub and Gitee from version 2.6.8 onward. It then says it still recommends that developers embrace mainstream frameworks, and describes what Layui does as filling the narrower gaps outside the mainstream. That is a deliberate positioning statement, not marketing. If you want a library that claims to be the future of the web, this is not it.

How Layui works: dist files, a module loader and CSS in the page

The build produces two artifacts that matter to consumers. package.json declares "main": "dist/layui.js" and exports "./css" as "./dist/css/layui.css", and the published npm package ships only the dist directory ("files": ["dist"]). So a consumer gets a JavaScript entry point and a stylesheet, not a source tree to compile. The CSS is generated by PostCSS from src/css/index.css, and the JavaScript is bundled by Rollup, both visible in the build scripts.

The package also exposes "./utils" with an ESM import path of "./dist/utils/index.js", and the root export has separate "import" and "require" conditions pointing at dist/index.js and dist/layui.js. That is the mechanism in practice: the library is delivered as browser-ready files rather than as something you tree-shake into an application bundle. Components such as the table, form, datepicker, layer and icon set are the surface area, and the README points to https://layui.dev/docs/2/ for the usage documentation.

The repository layout supports that reading. There is a src directory, a dist directory, a docs directory and a tests directory, with jest.config.mjs for tests and a visual test server invoked by the serve script. This is a library repository with its own build, not an application template.

Installing Layui and rendering a first component

The README does not walk through installation, so the concrete facts come from package.json. The package name is layui, the entry file is dist/layui.js and the stylesheet is dist/css/layui.css. Installing it from npm is the shortest path:

npm install layui

After that, both files exist under node_modules/layui/dist. Because the package only publishes dist, you can copy those two files into whatever directory your server already serves, which is the workflow the plain browser model implies. If you would rather not run npm at all, the README links the documentation site at https://layui.dev, and the project's own pages are where the download guidance lives.

Once the files are reachable from a page, the stylesheet goes in the head and the script follows the markup. The README gives no component snippet, so the honest statement is that the exact initialization call for a table or a datepicker has to come from the documentation at https://layui.dev/docs/2/ rather than from this article. What can be said from the repository is the shape of the delivery: one CSS file, one JavaScript file, and component behavior configured from the page.

For contributors rather than consumers, the repository's own scripts are the entry points. npm run dev starts scripts/dev.mjs, npm run build runs the clean and build steps, and npm test runs jest with --no-cache. Those are development commands for the library itself, not something an application needs.

Where Layui stops being the right tool

The most concrete limitation is version ambiguity. The README's documentation section lists Layui 3 as "正在开发中" (in development) and links the Layui 2 docs at https://layui.dev/docs/2/, while package.json declares "version": "3.0.0-alpha.3". An alpha version number in the published manifest means the npm artifact is not the same line as the documentation the README sends you to. Before you build anything, decide which one you are installing, because a component's documented options may not match the code you pulled.

The second limitation is architectural. A library that ships finished dist files and expects components to be configured from the page does not participate in a component tree. If your application composes state through a framework and you expect a UI library to expose typed props, hooks or a render function, Layui's model is the opposite of that. It is also a poor fit when you need a broad ecosystem of third-party extensions; the README positions Layui as filling gaps outside the mainstream, which is a statement about scope as much as about popularity.

The third is the maintenance history described in the README itself. A 2021 notice about the original site going offline caused a lasting impression that the project had stopped. The README says that impression was wrong, but it also documents why the impression formed. If your organization treats public announcements as risk signals, that history is part of the evaluation.

Layui compared with a component framework like Vue

The related searches around this project include "layui vue" and "layui vue admin", which suggests people arrive looking for a Vue integration. The difference in approach is worth stating plainly. Vue is a framework: you declare state, the framework decides what to render, and UI component libraries built for it expose props, events and slots that participate in that rendering cycle. Layui is a component library in the older sense: the HTML is already in the page, and the library attaches behavior and styling to it. There is no reactivity layer deciding when a table row should exist.

That difference cuts both ways. With Vue you get composition, a large ecosystem and tooling that assumes a build step. With Layui you get a page that works when a script tag loads, which is why the README says it lowers the barrier for non-front-end developers. If your team already writes Vue single-file components, adding Layui means maintaining two mental models. If your team writes server-rendered templates and wants a table with sorting and paging, Layui asks for far less setup.

The README does not claim Layui replaces mainstream frameworks. It says the opposite, and describes its role as covering the narrower gaps. Treat any expectation of a Vue-style integration as something to verify against the documentation rather than assume.

Maintenance cadence, upgrade cost and the MIT licence

The repository is not archived and the last push was on 2026-09-01. Releases have been frequent through 2026: v2.13.7 on 2026-05-29, v2.13.8 on 2026-06-30 and v2.13.9 on 2026-08-11. That is a steady patch cadence on the 2.13 line, and it sits alongside the 3.0.0-alpha.3 version declared in package.json, so both lines are visible in the repository at the same time.

Upgrade cost depends on which line you are on. Staying on 2.13.x means consuming dist/layui.js and dist/css/layui.css and reading the Layui 2 documentation the README links. Moving to the 3.x line means tracking an alpha, where the version string itself signals that the API is not settled. The CHANGELOG.md file at the repository root is where release-level detail lives; the README does not describe a migration path between the two lines.

Layui is released under the MIT licence, stated in the README and in package.json. MIT is permissive: it allows use, modification and redistribution with the licence and copyright notice retained. The README also points to a separate 免责声明 (disclaimer) document on Gitee for other related terms. This is a description of what the repository says, not legal advice; if the disclaimer text matters to your organization, read it directly.

Editorial conclusion

Layui fits developers building server-rendered admin pages who want components without a framework runtime, and it is a poor fit for anyone who needs a large third-party plugin ecosystem or deep integration with a modern build toolchain. Before adopting it, check which line you are on: the README points Layui 2 users to https://layui.dev/docs/2/ while package.json declares 3.0.0-alpha.3, so confirm whether the components you need are documented for the version you install.

Frequently asked questions

Official sources

1. layui/layui on GitHub
2. License: MIT
3. Project website
4. README
5. Releases