React - StoryBook - Error importing my components from node_modules - reactjs

Question

I have a project in React that contains quite a few components and I wanted to install StoryBook to be able to consult them.
For this I have installed StoryBook as a project outside my main project, leaving the folder structure as follows:
c:\development\MyProject
c:\development\StoryBook
Inside StoryBook I have added the following 'import' inside the Button.stories.jsx file that manages the buttons section that comes by default in the installation.
import SmallButton from 'MyProject/Buttons/SmallButton';
For this to work and to be able to import my component I have created a symbolic link inside the node_modules folder inside the StoryBook project.
c:\development\StoryBook\node_modules\MyProject <== symbolic link to c:\development\MyProject\src
When I start StoryBook with yarn storyboook it finds my component file but gives the following error that I can't resolve:
ERROR in ../MyProject/src/components/VSNButtons/SmallButton/index.js 10:12
Module parse failed: Unexpected token (10:12)
File was processed with these loaders:
* ./node_modules/#storybook/preset-create-react-app/node_modules/#pmmmwh/react-refresh-webpack-plugin
/loader/index.js
You may need an additional loader to handle the result of these loaders.
| const className = "ep-action " + (this.props.disabled ? "disabled " : " ") + (this.props.className || "");
| return (
> <span className={className} onClick={this.props.onClickHandle}>
| <span>
| <i className={"ep-action zmdi " + this.props.iconClass}></i>
# ./src/stories/atoms/buttons/Button.stories.jsx 150:0-58
# ./src sync ^\.(?:(?:^|[\\/]|(?:(?:(?!(?:^|[\\/])\.).)*?)[\\/])(?!\.)(?=.)[^\\/]*?\.stories\.(js|jsx|ts|tsx))$
# ./generated-stories-entry.js
# multi ./node_modules/#storybook/preset-create-react-app/node_modules/#pmmmwh/react-refresh-webpack-plugin/client/ReactRefreshEntry.js ./node_modules/#storybook/preset-create-react-app/node_modules/#pmmmwh/react-refresh-webpack-plugin/client/ErrorOverlayEntry.js ./nod
e_modules/#storybook/core-server/node_modules/#storybook/core-client/dist/esm/globals/polyfills.js ./node_modules/#storybook/core-server/node_modules/#storybook/core-client/dist/esm/globals/globals.js ./node_modules/webpack-hot-middleware/client.js?reload=true&quiet=fal
se&noInfo=undefined ./storybook-init-framework-entry.js ./node_modules/#storybook/addon-docs/dist/esm/frameworks/common/config.js-generated-config-entry.js ./node_modules/#storybook/addon-docs/dist/esm/frameworks/react/config.js-generated-config-entry.js ./node_modules/
#storybook/react/dist/esm/client/preview/config-generated-config-entry.js ./node_modules/#storybook/addon-links/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/#storybook/addon-actions/dist/esm/preset/addDecorator.js-generated-config-entry.js ./
node_modules/#storybook/addon-actions/dist/esm/preset/addArgs.js-generated-config-entry.js ./node_modules/#storybook/addon-backgrounds/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/#storybook/addon-backgrounds/dist/esm/preset/addParameter.js-g
enerated-config-entry.js ./node_modules/#storybook/addon-measure/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/#storybook/addon-outline/dist/esm/preset/addDecorator.js-generated-config-entry.js ./node_modules/#storybook/addon-interactions/dist
/esm/preset/argsEnhancers.js-generated-config-entry.js ./.storybook/preview.js-generated-config-entry.js ./generated-stories-entry.js
**File Configuration of StoryBook (main.js) **
module.exports = {
stories: [
"../src/**/*.stories.mdx",
"../src/**/*.stories.#(js|jsx|ts|tsx)"
],
staticDirs: ["../public"],
addons: [
"#storybook/addon-links",
"#storybook/addon-essentials",
"#storybook/preset-create-react-app",
"#storybook/addon-interactions",
],
features: {
postcss: false
},
framework: "#storybook/react",
core: {
builder: "webpack4",
}
};
And .babelrc of StoryBook
{
"sourceType": "unambiguous",
"presets": [
[
"#babel/preset-env",
{
"shippedProposals": true,
"loose": true
}
],
"#babel/preset-typescript"
],
"plugins": [
"#babel/plugin-transform-shorthand-properties",
"#babel/plugin-transform-block-scoping",
[
"#babel/plugin-proposal-decorators",
{
"legacy": true
}
],
[
"#babel/plugin-proposal-class-properties",
{
"loose": true
}
],
[
"#babel/plugin-proposal-private-methods",
{
"loose": true
}
],
"#babel/plugin-proposal-export-default-from",
"#babel/plugin-syntax-dynamic-import",
[
"#babel/plugin-proposal-object-rest-spread",
{
"loose": true,
"useBuiltIns": true
}
],
"#babel/plugin-transform-classes",
"#babel/plugin-transform-arrow-functions",
"#babel/plugin-transform-parameters",
"#babel/plugin-transform-destructuring",
"#babel/plugin-transform-spread",
"#babel/plugin-transform-for-of",
"babel-plugin-macros",
"#babel/plugin-proposal-optional-chaining",
"#babel/plugin-proposal-nullish-coalescing-operator",
[
"babel-plugin-polyfill-corejs3",
{
"method": "usage-global",
"absoluteImports": "core-js",
"version": "3.18.3"
}
]
]
}
Does anyone know what would be the solution to apply to solve this problem?
Or maybe it's because I can't import components from other projects.
Thank you very much.
PD: Sorry my english, I used GoogleTranslate to help me.