Configure storybook and eslint plugin for storybook - last

.storybook/main.js

@@ -1,7 +1,9 @@
+const path = require('path');
+
 module.exports = {
   "stories": [
     "../src/**/*.stories.mdx",
-    "../src/**/*.stories.tsx"
+    "../src/**/*.stories.@(js|jsx|ts|tsx)"
   ],
   "addons": [
     "@storybook/addon-links",
@@ -12,5 +14,12 @@ module.exports = {
   "framework": "@storybook/react",
   "core": {
     "builder": "@storybook/builder-webpack5"
-  }
+  },
+  webpackFinal: (config) => ({
+    ...config,
+    resolve: {
+      ...config.resolve,
+      alias: { ...config.resolve.alias, '@': path.resolve(__dirname, 'src') },
+    },
+  }),
 }

package.json

@@ -61,13 +61,13 @@
     "@babel/preset-typescript": "^7.17.12",
     "@babel/register": "~7.16.7",
     "@pmmmwh/react-refresh-webpack-plugin": "~0.5.4",
-    "@storybook/addon-actions": "^6.5.9",
-    "@storybook/addon-essentials": "^6.5.9",
-    "@storybook/addon-interactions": "^6.5.9",
-    "@storybook/addon-links": "^6.5.9",
-    "@storybook/builder-webpack5": "^6.5.9",
-    "@storybook/manager-webpack5": "^6.5.9",
-    "@storybook/react": "^6.5.9",
+    "@storybook/addon-interactions": "^6.4.19",
+    "@storybook/addon-actions": "^6.4.19",
+    "@storybook/addon-essentials": "^6.4.19",
+    "@storybook/addon-links": "^6.4.19",
+    "@storybook/builder-webpack5": "^6.4.19",
+    "@storybook/manager-webpack5": "^6.4.19",
+    "@storybook/react": "^6.4.19",
     "@storybook/testing-library": "^0.0.13",
     "@svgr/webpack": "~6.1.2",
     "@teamsupercell/typings-for-css-modules-loader": "~2.5.1",

src/stories/Page.stories.tsx

@@ -20,6 +20,7 @@ export const LoggedOut = Template.bind({});
 export const LoggedIn = Template.bind({});
 
 // More on interaction testing: https://storybook.js.org/docs/react/writing-tests/interaction-testing
+// @ts-ignore
 LoggedIn.play = async ({ canvasElement }) => {
   const canvas = within(canvasElement);
   const loginButton = await canvas.getByRole("button", { name: /Log in/i });