0.2.0 • Published 1 year ago

novella-svelte v0.2.0

Weekly downloads
-
License
MIT
Repository
github
Last release
1 year ago

Novella Svelte

Heavily biased Notion-style WYSIWYG editor without the bells and whistles. I'm maintaining this for my upcoming blogging website called BrainDead.

Based on Novel

Forked from Novel-Svelte

Made for BrainDead

Techs and Works

  • Svelte
  • Tiptap
  • Tailwind CSS

Usage

  1. Set up your Svelte project.

  2. Install novella-svelte

npm i novella-svelte
  1. Import and Use
<script>
	import { Editor } from 'novella-svelte';

	let saveStatus = 'Saved';
	let editor;
</script>

<main>
	<Editor
		bind:editor
		onUpdate={() => {
			saveStatus = 'Unsaved';
		}}
		onDebouncedUpdate={() => {
			saveStatus = 'Saving...';
			// Saving code go here
			saveStatus = 'Saved';
		}}
	>
		<div>
			{saveStatus}
		</div>
	</Editor>
</main>

Development Installation

  1. Install Node.js and npm. Download them here.

  2. Clone the repo

git clone https://github.com/TGlide/novel-svelte.git
cd novel-svelte
  1. Install npm packages:
npm install
  1. Start vite server:
npm run dev

Go to http://localhost:5173/ to view the preview.