Vite bump (tajo#47)

* docs: installation steps

* chore: bump vite

* chore: bump vite

* fix: docs

README.md

@@ -8,9 +8,9 @@ Ladle is an environment to develop, test and share your React components faster.
 ## Quick start
 
 ```sh
-yarn add @ladle/react
+yarn add @ladle/react react react-dom
 yarn ladle serve #dev environemnt
-yarn ladle build --optimize #build
+yarn ladle build #build
 ```
 
 assuming you have an existing story and `react`, `react-dom` installed

packages/ladle/lib/cli/strip-flow.js

@@ -7,7 +7,7 @@ const EXPORT_TYPES = /export\stype\s\*\sfrom\s[a-zA-Z0-9."\/\-_']+;/gm;
 
 /**
  * Create a Vite plugin object
- * @returns {import('@miksu/vite').Plugin} Returns esbuild plugin object
+ * @returns {import('vite').Plugin} Returns esbuild plugin object
  */
 export function flowPlugin(
   options /** {import('../shared/types').VitePluginOptions */ = {

packages/ladle/lib/cli/vite-base.js

@@ -8,12 +8,12 @@ import { flowPlugin, esbuildFlowPlugin } from "./strip-flow.js";
 /**
  * @param ladleConfig {import("../shared/types").Config}
  * @param configFolder {string}
- * @param viteConfig {import('@miksu/vite').InlineConfig}
+ * @param viteConfig {import('vite').InlineConfig}
  */
 const getBaseViteConfig = async (ladleConfig, configFolder, viteConfig) => {
   const __dirname = dirname(fileURLToPath(import.meta.url));
   /**
-   * @type {import('@miksu/vite').InlineConfig}
+   * @type {import('vite').InlineConfig}
    */
   const config = {
     ...viteConfig,

packages/ladle/lib/cli/vite-dev.js

@@ -1,4 +1,4 @@
-import { createServer } from "@miksu/vite";
+import { createServer } from "vite";
 import express from "express";
 import getPort from "get-port";
 import globby from "globby";
@@ -21,7 +21,7 @@ const bundler = async (config, configFolder) => {
   debug(`Port set to: ${port}`);
   try {
     /**
-     * @type {import('@miksu/vite').InlineConfig}
+     * @type {import('vite').InlineConfig}
      */
     const viteConfig = await getBaseViteConfig(config, configFolder, {
       mode: "development",

packages/ladle/lib/cli/vite-prod.js

@@ -1,4 +1,4 @@
-import { build } from "@miksu/vite";
+import { build } from "vite";
 import path from "path";
 import getBaseViteConfig from "./vite-base.js";
 
@@ -9,7 +9,7 @@ import getBaseViteConfig from "./vite-base.js";
 const viteProd = async (config, configFolder) => {
   try {
     /**
-     * @type {import('@miksu/vite').InlineConfig}
+     * @type {import('vite').InlineConfig}
      */
     const viteConfig = await getBaseViteConfig(config, configFolder, {
       mode: "production",

packages/ladle/package.json

@@ -36,7 +36,6 @@
     "@babel/template": "^7.16.7",
     "@babel/traverse": "^7.17.3",
     "@babel/types": "^7.17.0",
-    "@miksu/vite": "^0.0.2",
     "@reach/dialog": "^0.16.2",
     "@vitejs/plugin-react": "^1.2.0",
     "boxen": "^5.1.2",
@@ -54,7 +53,7 @@
     "open": "^8.4.0",
     "query-string": "^7.1.1",
     "rollup-pluginutils": "^2.8.2",
-    "vite": "^2.8.6"
+    "vite": "^2.9.0-beta.0"
   },
   "peerDependencies": {
     "react": ">=16.14.0",

packages/website/docs/features.md

@@ -0,0 +1,6 @@
+---
+id: features
+title: Features
+---
+
+Features

packages/website/docs/introduction.md

@@ -0,0 +1,15 @@
+---
+id: introduction
+title: Introduction
+slug: /
+---
+
+**Ladle is a drop-in alternative to <a href="https://storybook.js.org/">Storybook</a>**. It is a tool for developing and testing your React components in an environement that's isolated and faster than most real-world applications. Ladle also creates an index of your components so you can easily test them through tools like <a href="https://playwright.dev/">Playwright</a>.
+
+## Why? Performance!
+
+Ladle supports only React, embraces latest standards (ES Modules) and focuses on performance. It's built around [Vite](https://vitejs.dev/) - the modules are directly served to the browser and the bundling step is completely skipped. This means **instant server starts** no matter how many components it needs to load.
+
+Ladle still produces an optimized bundle using [rollup](https://rollupjs.org/guide/en/) when it's time to deploy it. Without adding a single component **Storybook 6.4 outputs 5.1MB of assets. Ladle only 250KB**. Ladle is almost 20x smaller.
+
+Each Ladle story gets automatically code-splitted so it doesn't matter how many components your want it to handle. Ladle always loads fast.