Skip to content

Latest commit

 

History

History
98 lines (64 loc) · 2.02 KB

README.md

File metadata and controls

98 lines (64 loc) · 2.02 KB
Raw

ikun-svelte-devtools

🍨 A vite plugin that improves the svelte development experience

Features

overview.png

page

In the pages module, you can quickly understand which pages the project contains

page.png

Routes

In the Routes module, you can quickly understand the routing information of the project

router.png

Assets

In the Assets module, you can quickly understand the static resources of the project, including pictures, fonts, etc.

assets.png

Search Packages

In the Search Packages module you can search for dependencies and install or uninstall them

search-package.png

Inspect

In the Inspect module you can view the compiled code, It comes from vite-plugin-inspect support.

inpect.png

Graph

In the Graph module, you can quickly understand the reference relationship between js and sfc through visualization

graph.png

Inspector

In the Inspector module, you can click on an element on the page to open the corresponding source code in the IDE. It comes from svelte-kit-inspector support.

EyeDropper

EyeDropper module can open a color picker

Install

npm i @ikun-svelte-devtools/server -D

Or

yarn add @ikun-svelte-devtools/server -D

Or

pnpm add @ikun-svelte-devtools/server -D

Usage

// vite.config.ts
import { sveltekit } from '@sveltejs/kit/vite';
import { defineConfig } from 'vite';
import svelteDevtools from '@ikun-svelte-devtools/server';
export default defineConfig({
	plugins: [
		svelteDevtools({
			sveltekit: sveltekit()
		})
	]
});

Thanks