Fable: Error(s) when referencing projects and files from different directories

[Zaid-Ajaj]

Consider the following directory:

I made this to reproduce a bug I found on another project of mine (call it A), namely that when the file Types.fs (inside directory "Two") is referenced from One.fsproj while One.fsproj is referencing another library, Code.fsproj in this instance, I expected to get this message (I got the same message for project A which has a similar structure):

ERROR in ../Two/Types.fs
Module not found: Error: Can't resolve 'babel-runtime/helpers/classCallCheck` in parent-path/of/Types.fs

ERROR in ../Two/Types.fs
Module not found: Error: Can't resolve 'babel-runtime/helpers/createClass` in parent-path/of/Types.fs

my guess is that Fable was looking for node_modules inside the "Two" directory but that directory only has one source file.

But I couldn't even get to this point because Fable wasn't able to properly reference Code.fsproj from One.fsproj:

Starting a fresh install by deleting all dotnet related + npm stuff, node_modules etc and doing:

yarn install
dotnet restore --no-cache

didn't help either
Here is the project:

Repro.zip

If you are able to build One.fsproj then the problem is probably just my machine

to build:

cd Repro/Sample/One
yarn install
dotnet restore --no-cache 
dotnet fable npm-run build 

[MangelMaxime]

Last time I was having this probably was due to symlinks because webpack don't handle them correctly.

Are you trying to create a lib and an application using this lib via Fable ?

[Zaid-Ajaj]

@MangelMaxime Yes indeed, following an approach similar to that of elmish

[alfonsogarciacaro]

I think when you reference files outside the project root Webpack cannot find modules that are supposed to be in the node_modules folder (like fable-core or the babel-runtime injections in this case). This is usually fixed by adding the following to webpack config:

  resolve: {
    modules: [
      // Fix the relative path if node_modules is not in the same dir as webpack.config.js
      "node_modules", resolve("./node_modules/")
    ]
  }

This assumes you have the following function in the config file: function resolve(filePath) { return path.join(__dirname, filePath) }

[MangelMaxime]

Another solution would be to follow Hink structure.

I use npm link to make the library available by npm install.
The trick is to make sure to have this lines.

[Zaid-Ajaj]

Omg this actually worked on the original project!!! @alfonsogarciacaro You are the best :smile:
Closing issue (that was fast) and will re-open if such problems persist

[Zaid-Ajaj]

Thanks @MangelMaxime for sharing, for now I will just use @alfonsogarciacaro's workaround (these lines should probably be in the template in the first place to avoid such problems altogether)