Creating npm package out of existing multi-component project without breaking it - reactjs

Question

Recently I finished a first "presentable" version of my latest react project. It features a set of components which I want to bundle into an npm package for publishing.
On top I have a few additional components that use the other components for integration testing. All of these components are still undergoing "heavy development".
Therefore, I would like to create an npm package out of a specific subfolder of my full project and (ideally) not lose the ability to develop further and run the full project without the need to always build, publish and npm install the npm package.
I've tried to find a matching tutorial (written or visual) for this case. The easiest one for me seems to be on Youtube (https://www.youtube.com/watch?v=esyS87NfBOw). It essentially describes the following steps:
Put everything to be bundled into a subfolder with an additional single "index.js" that exports all the components which should be importable from the final npm package. Make the project work with this setup (DONE)
Create a new folder for the npm package and run npm init there. The package should be called "react-tinyformly". Stay inside this folder
Add a build script for webpack into the new package.json
"scripts": {
"build" : "webpack"
}
Add dependencies and devDependencies like this. I added the ones that I need for my components here
"devDependencies": {
"#babel/core": "^7.7.5",
"#babel/preset-env": "^7.7.6",
"#babel/preset-react": "^7.7.4",
"babel-loader": "^8.0.6",
"css-loader": "^3.3.0",
"style-loader": "^1.0.1",
"webpack": "^4.41.2",
"webpack-cli": "^3.3.10"
},
"dependencies": {
"react": "^17.0.2",
"react-dom": "^17.0.2",
"#doist/react-interpolate": "^0.4.0",
"choices.js": "^10.1.0",
"date-fns": "^2.22.1",
"i18next": "^22.0.5",
"react-accessible-accordion": "^5.0.0",
"react-datepicker": "^4.1.1",
"react-i18next": "^12.0.0",
"react-json-tree": "^0.15.0",
"react-rating-stars-component": "^2.2.0",
"react-scripts": "4.0.3",
"react-tabs": "^4.2.1",
}
Run npm install
Create a src folder and put all the files of the project's package subfolder into the src folder
Create .babelrc
{
"presets": ["#babel/preset-react", "#babel/preset-env"]
}
Create webpack.config.js
var path = require("path");
module.exports = {
mode: "production",
entry: "./src/index.js",
output: {
path: path.resolve("build"),
filename: "index.js",
libraryTarget: "commonjs2"
},
module: {
rules: [
{ test: /\.js$/, exclude: /node_modules/, loader: "babel-loader" },
{
test: /\.css$/,
loader: "style-loader!css-loader"
}
]
},
externals: {
react: "react"
}
};
Create .gitignore and .npmignore as needed
Run npm run build. At this point, everything seems to be working fine.
Execute "npm link" in the npm package folder (i.e. the current folder)
Link to react with "npm link ..\node_modules\react"
Go back to the main project folder and link to the npm package locally "npm link react-tinyformly"
Change the import statement for the package component(s) like this
import Form from "react-tinyformly"
npm start
Now I get different errors, depending on which changes I additionally implemented. I understand that "sometimes" I need to add peerDependencies or also add "react-dom" to the externals list in webpack ... maybe I even need to add more dependencies to other dependency sections, even move "react" and "react-dom" to the devDependencies.
None of those were successful in the end.
What am I doing wrong? Is there an easier way? I cannot be the first one trying to achieve this, can I?
EDIT: This is the error when I put react and react-dom in the externalslist of webpack and doing everything else as described above:
Failed to compile.
./src/App.js
Module not found: Can't resolve 'react-tinyformly' in 'D:\Project Folders\ReactProjects\react_tinyformly\src'
When I list npm links, I get
+-- react-tinyformly#0.8.0 -> .\D:\Project Folders\ReactProjects\react_tinyformly\react-tinyformly
`-- react#17.0.2 -> .\D:\Project Folders\ReactProjects\react_tinyformly\node_modules\react