Missing semicolon linting error with typescript

So i have a storybook project with a story file like so:

import { Meta } from '@storybook/react';

// Replacing the <Story/> element with a Story function is also a good way of writing decorators.
// Useful to prevent the full remount of the component's story.
export default {
  component: YourComponent,
  decorators: [
    (Story) => (
      <div style={{ margin: '3em' }}>
        {Story()}
      </div>
    ),
  ],
} as Meta;

Works fine, but I’m getting an eslint error here } as Meta; about having a missing semicolon after the } which obviously wouldn’t work.

Only solutions I’ve seen so far recommend just turning off semicolon linting rules all together. Assuming there’s a simple tweak i can make to my eslintrc.json, but haven’t come across it yet.

lint error

eslintrc.json

{
    "parser": "babel-eslint",
    "parserOptions": {
        "ecmaVersion": 6,
        "sourceType": "module",
        "ecmaFeatures": {
            "jsx": true,
            "modules": true
        }
    },
    "env": {
        "browser": true,
        "jquery": true,
        "es6": true,
        "jest": true
    },
  "extends": [ "eslint:recommended", "plugin:react/recommended" ],
  "plugins": [
    "react-hooks"
  ],
  "rules": {
    "react-hooks/rules-of-hooks": "error", // Checks rules of Hooks
    "react-hooks/exhaustive-deps": "warn", // Checks effect dependencies
    "block-spacing": "error",
    "brace-style": "error",
    "comma-spacing": "error",
    "complexity": ["error", 21],
    "curly": "error",
    "dot-location": [
      "error",
      "property"
    ],
    "guard-for-in": "error",
    "indent": [
      "error",
      2,
      { "SwitchCase": 1 }
    ],
    "key-spacing": "error",
    "keyword-spacing": "error",
    "lines-between-class-members": "error",
    "max-depth": "error",
    "new-cap": "error",
    "no-eval": "error",
    "no-whitespace-before-property": "error",
    "react/jsx-tag-spacing": "error",
    "react/prop-types": 0,
    "semi": [
      "error",
      "always"
    ],
    "space-before-blocks": "error",
    "space-infix-ops": "error"
  },
    "globals": {
        "process": true,
        "maestroStrings": true,
        "GLOBAL_BrowserTimeZone": true,
        "profiseeConfig": true,
        "Mdm": true,
        "apiRequestVerificationToken": true,
        "LoadReportPart": true,
        "FilterSortDialog": true,
        "module": true,
        "global": true,
        "_profHandling401": true
    }
}

Answer

Got away with this, but couldn’t figure out the type import for the story prop

const Story = {
  component: ContextButton,
  title: "ContextButton",
  argTypes: { onClick: { action: "Button clicked" },  },
  decorators: [
    // should be narrowed down from `any` to `StoryFnReactReturnType` but can't find the type import for it 😐
    (story: () => any) => (
      <div style={{height: "90vh", width: "90vw", display: "flex", "alignItems": "center", "justifyContent": "center"}}>
        {story()}
      </div>
    ),
  ],
}; 
export { Story as default };