lasagna

lasagna(ラザニア)はSASSとJavascriptのカスタムライブラリです。

Document 👇

https://lasagna-doc.walkal.one

Install

npm install @walkal0ne/lasagna

or

bun add @walkal0ne/lasagna

How to Update

srcディレクトリ内のファイルを編集した後、Githubにプッシュし、以下のコマンドを実行してください。

$ npm run build
$ npm run minor-update

CLAUDE.md テンプレート

他のプロジェクトでlasagnaライブラリを使用する際のCLAUDE.mdテンプレートです：

# CLAUDE.md

このファイルは、このリポジトリでコードを扱う際のClaude Code (claude.ai/code) へのガイダンスを提供します。

## 開発コマンド

| コマンド | 目的 |
|---------|------|
| `npm install` | 依存関係のインストール |
| `npm run dev` | 開発サーバー起動 |
| `npm run build` | プロダクションビルド |

## @WALKAL0NE/lasagna ライブラリ

**重要**: このプロジェクトでは@WALKAL0NE/lasagnaライブラリを積極的に使用してください。

- **JavaScriptドキュメント**: `node_modules/@WALKAL0NE/lasagna/js-tutorial.md`
  - DOM操作、デバイス検出、テキスト処理、デバッグツール
- **Sassドキュメント**: `node_modules/@WALKAL0NE/lasagna/sass-tutorial.md`
  - レスポンシブデザイン、レイアウト制御、ユーティリティ関数

### 推奨する使用方法
- DOM操作: `$()`, `$$()` を使用
- デバイス判定: `getDeviceType()` を使用  
- レスポンシブ: `+sp-view`, `+pc-view` ミックスインを使用
- レイアウト: `+gap()`, `+flex-middle`, `+default-width()` を活用
- 開発時: `<debug-grid>` でレイアウト確認

詳細な使用例はドキュメントを参照してください。効率的な開発のために、標準的なCSS/JSではなくlasagnaライブラリの機能を優先的に使用してください。