유튜브 뮤직의 Electron 래퍼; 기능:
- 원래의 인터페이스를 유지하는 것을 목표로 하는 네이티브 디자인 및 느낌
- 맞춤 플러그인을 위한 프레임워크: 스타일, 콘텐츠, 기능 등 필요에 따라 유튜브 뮤직을 변경하고, 클릭 한 번으로 플러그인을 활성화/비활성화할 수 있습니다.
-
일시 정지 시 자동 확인 (항상 활성화 됨): 일정 시간이 지나면 음악을 일시 정지하는 "계속 시청하시겠습니까?" 팝업을 비활성화합니다.
-
이외에 더 많은 기능 ...
-
애드블록: 모든 광고와 트래커를 즉시 차단합니다
-
앨범 컬러 기반 테마: 앨범 색상 팔레트를 기반으로 동적 테마 및 시각 효과를 적용합니다
-
앰비언트 모드: 영상의 간접 조명을 화면 배경에 투사합니다.
-
오디오 컴프레서: 오디오에 컴프레서를 적용합니다 (신호에서 가장 시끄러운 부분의 음량을 낮추고 가장 조용한 부분의 음량을 높임)
-
네비게이션 바 흐림 효과: 내비게이션 바를 투명하고 흐릿하게 만듭니다
-
나이 제한 우회: 유튜브의 나이 제한을 우회합니다
-
자막 선택기: 자막을 활성화합니다
-
컴팩트 사이드바: 사이드바를 항상 컴팩트 모드로 설정합니다
-
크로스페이드: 노래 사이에 크로스페이드 효과를 적용합니다
-
자동 재생 해제: 노래를 '일시 정지' 모드로 시작하게 합니다
-
디스코드 활동 상태: 활동 상태 (Rich Presence)를 사용하여 친구들에게 내가 듣는 음악을 보여주세요
-
다운로더: UI에서 직접 MP3/소스 오디오를 다운로드하세요
-
지수 볼륨: 음량 슬라이더를 지수적으로 만들어 더 낮은 음량을 쉽게 선택할 수 있도록 합니다.
-
인앱 메뉴: 메뉴 표시줄을 더 멋지게, 그리고 다크 또는 앨범의 색상으로 만듭니다
(이 플러그인 및 메뉴 숨기기 옵션을 활성화한 후 메뉴에 액세스하는 데 문제가 있는 경우 이 글을 참조하세요)
-
Last.fm: Last.fm에 대한 스크러블 지원을 추가합니다
-
Lumia Stream: Lumia Stream 지원을 추가합니다
-
Genius 가사: 더 많은 곡에 대해 가사 지원을 추가합니다
-
네비게이션: 브라우저에서처럼, UI에 직접 통합된 앞으로/뒤로 탐색하는 화살표를 추가합니다
-
Google 로그인 제거: UI에서 Google 로그인 버튼 및 링크 제거하기
-
알림: 노래 재생이 시작되면 알림을 표시 (Windows에서는 대화형 알림 사용 가능)
-
PiP: 앱을 PiP 모드로 전환할 수 있게 허용합니다
-
재생 속도: 빨리 듣거나, 천천히 들어보세요! 노래 속도를 제어하는 슬라이더를 추가합니다
-
정확한 음량: 사용자 지정 HUD와 사용자 지정 음량 단계 및 마우스 휠/단축키를 사용하여 음량을 정확하게 제어하세요
-
영상 품질 체인저: 영상 오버레이의 버튼으로 영상 품질을 변경할 수 있게 합니다
-
단축키 (& MPRIS): 재생을 위한 전역 단축키 설정 허용 (재생/일시 정지/다음/이전) + 미디어 키를 재정의하여 미디어 osd 비활성화 + Ctrl/CMD + F 검색 활성화 + 미디어 키에 대한 리눅스 MPRIS 지원 활성화 + 고급 사용자를 위한 사용자 지정 단축키 지원
-
무음 건너뛰기 - 노래의 무음 부분을 자동으로 건너뜁니다
-
SponsorBlock: 인트로/아웃트로와 같은 음악이 아닌 부분이나, 노래가 재생되지 않는 뮤직 비디오의 일부를 자동으로 건너뜁니다
-
작업표시줄 미디어 컨트롤: Windows 작업표시줄에서 재생을 제어하세요
-
TouchBar: macOS 사용자를 위한 TouchBar 위젯을 추가합니다
-
영상 전환: 영상/노래 모드를 전환하는 버튼을 추가합니다. 선택적으로 전체 영상 탭을 제거할 수도 있습니다
-
비주얼라이저: 플레이어에 시각화 도구 추가
Hosted Weblate에서 번역을 도울 수 있습니다.
최신 릴리즈를 확인하여 최신 버전을 빠르게 찾을 수 있습니다.
AUR에서 youtube-music-bin 패키지를 설치합니다. AUR 설치 지침은 이 위키 페이지를 참조하세요.
Homebrew를 사용하여 앱을 설치할 수 있습니다:
brew install --cask https://raw.githubusercontent.com/th-ch/youtube-music/master/youtube-music.rb(앱을 수동으로 설치하고) 앱을 실행할 때 손상되었기 때문에 열 수 없습니다.라는 오류가 발생하면 터미널에서 다음을 실행하세요:
xattr -cr /Applications/YouTube\ Music.appScoop 패키지 매니저를 사용하여 extras 버킷에서 youtube-music 패키지를 설치할 수 있습니다.
scoop bucket add extras
scoop install extras/youtube-music또는 Windows 11의 공식 CLI 패키지 관리자인 Winget을 사용하여 th-ch.YouTubeMusic 패키지를 설치할 수 있습니다.
참고: "알 수 없는 게시자"의 파일이기 때문에 Microsoft Defender의 SmartScreen에서 설치를 차단할 수 있습니다. 이는 GitHub에서 동일 파일을 수동으로 다운로드한 후 실행 파일(.exe)을 실행하려고 할 때도 마찬가지로 발생합니다.
winget install th-ch.YouTubeMusic- 릴리즈 페이지에서 _본인 기기 아키텍처_에 맞는
*.nsis.7z파일을 다운로드하세요.x64는 64비트 Windows 용입니다.ia32는 32비트 Windows 용입니다.arm64는 ARM64 Windows 용입니다.
- 릴리즈 페이지에서 설치기를 다운로드하세요. (
*-Setup.exe) - 두 파일을 동일한 위치에 놓아주세요.
- 설치기를 실행하세요.
CSS 파일을 로드하여 애플리케이션의 모양을 변경할 수 있습니다(설정 > 시각적 변경 > 테마).
일부 사전 정의 테마는 https://github.com/kerichdev/themes-for-ytmdesktop-player 에서 사용할 수 있습니다.
git clone https://github.com/th-ch/youtube-music
cd youtube-music
pnpm install --frozen-lockfile
pnpm dev플러그인을 사용하면 할 수 있는 것들:
- 앱 조작 - Electron에서
BrowserWindow가 플러그인 핸들러로 전달 - HTML/CSS를 조작하여 프론트엔드를 변경
plugins/나만의-플러그인-이름에 폴더를 만듭니다:
index.ts: 플러그인의 메인 파일입니다.
import style from './style.css?inline'; // 스타일을 인라인으로 가져옵니다
import { createPlugin } from '@/utils';
export default createPlugin({
name: 'Plugin Label',
restartNeeded: true, // 값이 true면, YTM은 재시작 다이얼로그를 표시합니다
config: {
enabled: false,
}, // 나의 커스텀 config
stylesheets: [style], // 나의 스타일
menu: async ({ getConfig, setConfig }) => {
// 모든 *Config 메서드는 Promise<T>로 래핑됩니다
const config = await getConfig();
return [
{
label: 'menu',
submenu: [1, 2, 3].map((value) => ({
label: `value ${value}`,
type: 'radio',
checked: config.value === value,
click() {
setConfig({ value });
},
})),
},
];
},
backend: {
start({ window, ipc }) {
window.maximize();
// 이를 사용하여 렌더러 플러그인과 통신할 수 있습니다
ipc.handle('some-event', () => {
return 'hello';
});
},
// config가 변경되면 실행됩니다
onConfigChange(newConfig) { /* ... */ },
// 플러그인이 비활성화되면 실행됩니다
stop(context) { /* ... */ },
},
renderer: {
async start(context) {
console.log(await context.ipc.invoke('some-event'));
},
// 렌더러에서만 사용 가능한 훅입니다
onPlayerApiReady(api: YoutubePlayer, context: RendererContext<T>) {
// 플러그인의 config를 간단하게 설정할 수 있습니다
context.setConfig({ myConfig: api.getVolume() });
},
onConfigChange(newConfig) { /* ... */ },
stop(_context) { /* ... */ },
},
preload: {
async start({ getConfig }) {
const config = await getConfig();
},
onConfigChange(newConfig) {},
stop(_context) {},
},
});- 사용자 정의 CSS 삽입: 같은 폴더에
style.css파일을 생성합니다:
// index.ts
import style from './style.css?inline'; // 스타일을 인라인으로 가져옵니다
import { createPlugin } from '@/utils';
export default createPlugin({
name: 'Plugin Label',
restartNeeded: true, // 값이 true면, YTM은 재시작 다이얼로그를 표시합니다
config: {
enabled: false,
}, // 나의 커스텀 config
stylesheets: [style], // 나의 커스텀 스타일
renderer() {} // 렌더러 훅 정의
});- HTML을 변경하려는 경우:
import { createPlugin } from '@/utils';
export default createPlugin({
name: 'Plugin Label',
restartNeeded: true, // 값이 true면, YTM은 재시작 다이얼로그를 표시합니다
config: {
enabled: false,
}, // 나의 커스텀 config
renderer() {
// 로그인 버튼을 제거합니다
document.querySelector(".sign-in-link.ytmusic-nav-bar").remove();
} // 렌더러 훅 정의
});- 프론트엔드와 백엔드 간의 통신: Electron의
ipcMain모듈을 사용하여 수행할 수 있습니다.SponsorBlock플러그인의index.ts파일과 예제를 참조하세요.
- 레포지토리를 복제 (clone) 합니다
- 이 가이드에 따라
pnpm을 설치합니다. pnpm install --frozen-lockfile을 실행하여 종속성을 설치합니다.pnpm build:OS을 실행합니다.
pnpm dist:win- Windowspnpm dist:linux- Linuxpnpm dist:mac- MacOS
electron-builder를 사용하여 macOS, Linux 및 Windows용 앱을 빌드합니다.
pnpm startpnpm testPlaywright를 사용하여 앱을 테스트합니다.
MIT © th-ch
메뉴 숨기기 옵션이 켜져 있는 경우 - alt 키(또는 인앱 메뉴 플러그인을 사용하는 경우 ` [백틱] 키)로 메뉴를 표시할 수 있습니다.