You must use Storybook with webpack5!
npx sb@next init --builder webpack5
Remember to install all nedded packages because debugging babel deps might be tricky.
Enjoy!
| const typography = { | |
| primary: { | |
| family: "Lato" | |
| }, | |
| secondary: { | |
| family: "Roboto" | |
| } | |
| }; | |
| const aliases = Object.entries(typography) |
| export type PrimarySet = Record<keyof typeof primary, string>; | |
| export const primary = { | |
| primary200: "--primary-200", | |
| primary300: "--primary-300", | |
| primary400: "--primary-400", | |
| primary500: "--primary-500", | |
| } | |
| export const primaryShades: PrimarySet = { |
| export const parameters = { | |
| actions: { argTypesRegex: "^on[A-Z].*" }, | |
| controls: { | |
| matchers: { | |
| color: /(background|color)$/i, | |
| date: /Date$/, | |
| }, | |
| }, | |
| previewTabs: { | |
| canvas: { |
You must use Storybook with webpack5!
npx sb@next init --builder webpack5
Remember to install all nedded packages because debugging babel deps might be tricky.
Enjoy!
| module.exports = function (source) { | |
| console.log("The original file was here:", this.resourcePath); | |
| console.log(source); | |
| return source; | |
| }; |
| /* eslint-disable no-console */ | |
| /* eslint-disable react-hooks/exhaustive-deps */ | |
| import { useState, useEffect } from "react"; | |
| export const useLocalStorage = <T>(key: string, initialValue: T) => { | |
| const [storedValue, setStoredValue] = useState<T | undefined>(); | |
| const setValue = (value: T) => { | |
| window.localStorage.setItem(key, JSON.stringify(value)); | |
| }; |
| browser-sync start --proxy "localhost:3000" --no-ui --port 3001 |
| // src/index.ts | |
| import { lubiePlacki } from "./placki"; | |
| function printMessage(msg: string): void { | |
| console.log(`Message: ${msg}`); | |
| } | |
| printMessage("Hello, TypeScript"); | |
| debugger; | |
| lubiePlacki(); |
| { | |
| "compilerOptions": { | |
| "target": "es2018", | |
| "outDir": "./dist", | |
| "rootDir": "./src", | |
| "noEmitOnError": true, | |
| "module": "commonjs" | |
| } | |
| } |
| module.exports = { | |
| env: { | |
| browser: true, | |
| es2021: true, | |
| }, | |
| extends: [ | |
| "plugin:react/recommended", | |
| "airbnb", | |
| "plugin:import/typescript", | |
| "prettier", |