# web-components

## storybook up and running

```shell
yarn dlx sb@latest init --builder @storybook/builder-vite
```

ensure 3rd party deps

```json
// package.json
{
  "devDependencies": {
    ...,
    "@babel/core": "^7.18.10",
    "@mdx-js/react": "^1.6.22",
    "@storybook/addon-actions": "^6.5.9",
    "@storybook/addon-backgrounds": "^6.5.9",
    "@storybook/addon-docs": "^6.5.9",
    "@storybook/addon-essentials": "^6.5.9",
    "@storybook/addon-links": "^6.5.9",
    "@storybook/addon-measure": "^6.5.9",
    "@storybook/addon-outline": "^6.5.9",
    "@storybook/builder-vite": "^0.2.2",
    "@storybook/client-api": "^6.5.9",
    "@storybook/client-logger": "^6.5.9",
    "@storybook/web-components": "^6.5.9",
    "@types/babel__core": "^7",
    "@types/react": "^17",
    "@types/react-dom": "^17",
    "babel-loader": "^8.2.5",
    "lit-html": "^2.2.7",
    "object-inspect": "^1.12.2",
    "react": "^17.0.2",
    "react-dom": "^17.0.2",
    ...
  }
}
```

then unplug `object-inspect`

```shell
yarn unplug object-inpect
```

modify code in the unplugged folder

```javascript
// .yarn/unplugged/object-inspect-npm-1.12.2-f125a822c0/node_modules/object-inspect/index.js
var utilInspect = require('./util.inspect');
var inspectCustom = utilInspect.custom;

// becomes 👇
var utilInspect = require('./util.inspect');
var inspectCustom = utilInspect;
```

```shell
rm -rf node_modules/
```
