This repository is a tool which helps you create your lrc file.
It's hard to find a user-friendly and cross-platform tool to create lrc. So I made one myself.
open lrc-maker to start. You can add the link to browser bookmark. It is easy to use.
Darg and drop the file in the page to load an audio file.
Use the arrow key and space key to insert the timestamp.
| key | function |
|---|---|
| space | insert time stamp tag |
| delete / ⌘+delete | remove time stamp tag |
| ctrl+enter / ⌘+return | play / pause |
| ← / a | step backward 5 seconds |
| → / d | step forward 5 seconds |
| ↑ / w / j | select previous line |
| ↓ / s / k | select next line |
| ctrl+↑ / ⌘+↑ | speed up playback rate |
| ctrl+↓ / ⌘+↓ | speed down playback rate |
| r | reset playback rate |
The most modern browsers are supported. The current version uses a lot of modern browser APIs to improve performance and improve the user experience. This project uses the ES Module to load the script code, which means that the browser version should meet the following requirements.
| browser | version |
|---|---|
| EDGE | >= 16 |
| Firefox | >= 60 |
| Chrome | >= 61 |
| Safari | >= 11 |
| ios_saf | >= 11 |
Limited support for EDGE browsers.
The browsers which do not have ES Module support will load the fallback script. Note: The fallback is not tested. The old browsers may encounter CSS layout confusion.
Ancient browsers such as IE are no longer supported. If you are an ancient browser user, it is better to use the old version of this project.
If you want to run this project on your computer locally, follow the tips.
# clone this repo
git clone https://github.com/magic-akari/lrc-maker.git
cd lrc-maker
# install dependencies
npm i
# build
npm run build
# or build with watch mode
npm start
This project does not configure a local server, and a plugin for vscode (Live Server) is used in actual development.
The configs of Live Server is as following.
{
"liveServer.settings.root": "/build",
"liveServer.settings.mount": [
["/node_modules", "./node_modules"],
["/src", "./src"]
]
}If you like give us a star ⭐ Share this project to help more people.
这是一个滚动歌词制作工具，滚动歌词是指带有时间标签的文本。
作者对于目前已有的工具不满意，无法跨平台使用，所以自己制作了一个。
打开歌词滚动姬，即可开始，你可以把这个链接收藏到浏览器书签。
| 按键 | 功能 |
|---|---|
| space | 插入时间标签 |
| delete / ⌘+delete | 移除时间标签 |
| ctrl+enter / ⌘+return | 播放 / 暂停 |
| ← / a | 回退 5 秒 |
| → / d | 前进 5 秒 |
| ↑ / w / j | 选择上一行 |
| ↓ / s / k | 选择下一行 |
| ctrl+↑ / ⌘+↑ | 提高播放速度 |
| ctrl+↓ / ⌘+↓ | 降低播放速度 |
| r | 重置播放速度 |
本项目的目标是兼容大部分现代浏览器，当前版本使用了很多的现代浏览器 API 来提升效能，改善用户体验。 本项目使用了 ES Module 来加载代码，这意味着浏览器的版本应该满足下列要求。
| 浏览器 | 版本 |
|---|---|
| EDGE | >= 16 |
| Firefox | >= 60 |
| Chrome | >= 61 |
| Safari | >= 11 |
| ios_saf | >= 11 |
对 EDGE 浏览器低限度支持。
对于没有 ES Module 支持的浏览器，仍然做了回退处理以便正常使用。注意：此部分没有进行测试，旧浏览器仍然可能遇到 css 的布局错乱问题。
IE 等旧浏览器不再支持。对于这类浏览器使用者，可以使用本项目的旧版本。
如果你想在本地计算机上运行这个项目，可以遵循下面操作。
# 克隆这个仓库
git clone https://github.com/magic-akari/lrc-maker.git
cd lrc-maker
# 安装依赖
npm i
# 构建
npm run build
# 开发模式构建
npm start
本项目没有配置本地服务器，实际开发中使用了 vs code 的插件 Live Server 并使用了以下配置。
{
"liveServer.settings.root": "/build",
"liveServer.settings.mount": [
["/node_modules", "./node_modules"],
["/src", "./src"]
]
}如果你喜欢这个项目，请点一个星星吧:star:，分享这个项目来帮助更多的人。