Storybook publish step failing in monorepo - reactjs

Question

Current Behavior
Getting semicolon missing error only on publish to storybook-to-ghpages step.
Expected Behavior
Should deploy the stories to GitHub pages.
Steps to Reproduce
Create a new nx workspace.
Create two new react libraries using nx console vs code extension.
Running storybook locally works fine using nx run project-name:storybook.
When trying to deploy to github pages using npx -p #storybook/storybook-deployer storybook-to-ghpages you will get missing semicolon error.
You can also watch this youtube video to see how to reproduce:
https://www.youtube.com/watch?v=c323HOuFKkA
Our package.json at the root:
{
"name": "cxc-react-monorepo",
"version": "0.0.0",
"private": true,
"scripts": {
"prepare": "husky install",
"start": "nx serve",
"build": "nx run-many --target=build --all",
"build:icons": "nx run cxc-react-icons:build-icons",
"test": "nx run-many --target=test --all",
"graph": "nx graph",
"lint": "nx workspace-lint && nx lint",
"e2e": "nx e2e",
"affected:libs": "nx affected:libs",
"affected:build": "nx affected:build",
"affected:e2e": "nx affected:e2e",
"affected:test": "nx affected:test",
"affected:lint": "nx affected:lint",
"affected:graph": "nx affected:graph",
"commit": "git cz",
"version": "lerna version",
"version:beta": "lerna version --conventional-prerelease",
"release:ci": "lerna publish from-package"
},
"dependencies": {
"#ford/ford-design-system": "^18.3.0",
"axios": "^0.27.2",
"clsx": "^1.1.1",
"core-js": "^3.6.5",
"react": "^18.1.0",
"react-dom": "^18.1.0",
"react-hook-form": "^7.31.3",
"regenerator-runtime": "0.13.7",
"tslib": "^2.3.0",
"valtio": "^1.6.0"
},
"devDependencies": {
"#nrwl/cli": "14.1.4",
"#nrwl/cypress": "14.1.4",
"#nrwl/eslint-plugin-nx": "14.1.4",
"#nrwl/jest": "14.1.4",
"#nrwl/linter": "14.1.4",
"#nrwl/react": "14.1.4",
"#nrwl/web": "14.1.4",
"#nrwl/workspace": "14.1.4",
"#testing-library/jest-dom": "^5.16.4",
"#testing-library/react": "^13.2.0",
"#testing-library/user-event": "^14.2.0",
"#types/jest": "27.4.1",
"#types/node": "16.11.7",
"#types/react": "18.0.8",
"#types/react-dom": "18.0.3",
"#types/react-modal": "^3.13.1",
"#typescript-eslint/eslint-plugin": "~5.18.0",
"#typescript-eslint/parser": "~5.18.0",
"babel-jest": "27.5.1",
"chalk": "^2.4.1",
"cypress": "^9.1.0",
"cz-conventional-changelog": "^3.3.0",
"eslint": "~8.12.0",
"eslint-config-prettier": "8.1.0",
"eslint-plugin-cypress": "^2.10.3",
"eslint-plugin-import": "2.26.0",
"eslint-plugin-jsx-a11y": "6.5.1",
"eslint-plugin-react": "7.29.4",
"eslint-plugin-react-hooks": "4.5.0",
"husky": "^8.0.1",
"jest": "27.5.1",
"lerna": "^4.0.0",
"nx": "14.1.4",
"prettier": "^2.5.1",
"react-modal": "^3.15.1",
"react-test-renderer": "^18.1.0",
"shelljs": "^0.8.2",
"svgr": "^1.10.0",
"ts-jest": "27.1.4",
"ts-node": "9.1.1",
"typescript": "~4.6.2"
},
"config": {
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
}
}
Failure Logs
RROR in
src/stories/Button.stories.tsx
Line 13:2: Parsing error: Missing semicolon
11 | backgroundColor: { control: 'color' },
12 | },
> 13 | } as Meta;
| ^
14 |
15 | const Template: Story<ButtonProps> = (args) => <Button {...args} />;
16 |
Environment
nx : 14.1.9
#nrwl/angular : Not Found
#nrwl/cypress : 14.1.9
#nrwl/detox : Not Found
#nrwl/devkit : 14.1.9
#nrwl/eslint-plugin-nx : 14.1.9
#nrwl/express : Not Found
#nrwl/jest : 14.1.9
#nrwl/js : 14.1.9
#nrwl/linter : 14.1.9
#nrwl/nest : Not Found
#nrwl/next : Not Found
#nrwl/node : Not Found
#nrwl/nx-cloud : Not Found
#nrwl/nx-plugin : Not Found
#nrwl/react : 14.1.9
#nrwl/react-native : Not Found
#nrwl/schematics : Not Found
#nrwl/storybook : 14.1.9
#nrwl/web : 14.1.9
#nrwl/workspace : 14.1.4
typescript : 4.6.4
rxjs : 6.6.7