Skip to content

fix issue jsonrpc id files mismatch with full reload #55

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
jkone27 wants to merge 9 commits into
base: main
Choose a base branch
from
Open

fix issue jsonrpc id files mismatch with full reload #55

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
9 commits
Select commit Hold shift + click to select a range
93bde1d
fix issue jsonrpc id files mismatch with full reload
jkone27 Jun 27, 2025
af329c2
fix package json
jkone27 Jun 27, 2025
e163f67
fix package
jkone27 Jun 27, 2025
6ff6216
fix props, add changelog
jkone27 Jun 28, 2025
ce01129
fix changelog
jkone27 Jun 28, 2025
42d9b7f
small change
jkone27 Jun 28, 2025
c57b3c6
protocol error unknown
jkone27 Jun 28, 2025
87c6369
unknown error for protocol
jkone27 Jun 28, 2025
c1b30fa
add comment
jkone27 Jun 28, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
12 changes: 12 additions & 0 deletions index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -414,6 +414,18 @@ export default function fablePlugin(userConfig) {
state.dotnetProcess.stdout,
);

// Attach protocol-level error handler
if (typeof state.endpoint.on === "function") {
state.endpoint.on("error", async (err) => {
logWarn(
"protocol",
`[fable] Protocol-level error from JSONRPCEndpoint: ${
err && err.message ? err.message : err
}`
);
});
}

if (state.isBuild) {
await projectChanged(
this.addWatchFile.bind(this),
Expand Down
6 changes: 3 additions & 3 deletions sample-project/App.fsproj
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,14 +10,14 @@
<ItemGroup>
<PackageReference Include="Fable.Browser.Dom" Version="2.14.0" />
<PackageReference Include="Fable.Core" Version="4.3.0" />
<PackageReference Include="Nojaf.Fable.React" Version="0.0.2" />
<PackageReference Include="Feliz" Version="2.9.0" />
Copy link
Collaborator Author

@jkone27 jkone27 Jun 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

update to standard fable Feliz remove Nojaf.Fable.React experimental package from sample

<PackageReference Include="Thoth.Json" Version="10.2.0" />
</ItemGroup>

<ItemGroup>
<Compile Include="Math.fs" />
<Compile Include="Component.fsi" />
<Compile Include="Component.fs" />
<Compile Include="./components/TestComponent.fs" />
Copy link
Collaborator Author

@jkone27 jkone27 Jun 27, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

added an external component as the issue only happens when there is at least one component importing another it seems, not only with a root component

<Compile Include="RootComponent.fs" />
<Compile Include="Library.fs" />
</ItemGroup>
</Project>
17 changes: 0 additions & 17 deletions sample-project/Component.fs
View file
Open in desktop

This file was deleted.

6 changes: 0 additions & 6 deletions sample-project/Component.fsi
View file
Open in desktop

This file was deleted.

9 changes: 4 additions & 5 deletions sample-project/Library.fs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,16 +4,15 @@ open Fable.Core
open Browser.Dom
open Math
open Thoth.Json
open Fable.React

let r = sum 1 19

let someJsonString =
Encode.object [ "track", Encode.string "Changes" ] |> Encode.toString 4

let h1Element = document.querySelector "h1"
let h1Element = document.querySelector "#dyn"
h1Element.textContent <- $"Dynamic Fable text %i{r}! %s{someJsonString}"

open React

let app = document.querySelector "#app"
ReactDom.createRoot(app).render (JSX.create Components.Component.Component [])
let root = Feliz.ReactDOM.createRoot(document.getElementById "app")
root.render(Components.RootComponent.El())
19 changes: 19 additions & 0 deletions sample-project/RootComponent.fs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
module Components.RootComponent

open Feliz
open Fable.Core

JsInterop.importSideEffects "./app.css"


[<ReactComponent>]
let El () =
let count, setCount = React.useState 0
React.fragment [
Test.El({| name = "TestComponent" |})
Html.h1 "Vite plugin rocks!"
Html.button [
prop.onClick (fun _ -> setCount (count + 1))
prop.text $"Current state {count}"
]
]
5 changes: 5 additions & 0 deletions sample-project/app.css
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -41,4 +41,9 @@ h1 {
box-shadow: 0px 3px 3px 0px rgba(0,0,0,0.25);
}
}
}

#test {
color: red;
background-color: yellow;
}
21 changes: 21 additions & 0 deletions sample-project/components/TestComponent.fs
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,21 @@
module Components.Test

open Feliz

[<ReactComponent>]
let El (props: {| name: string |}) =
React.fragment [
Html.div [
prop.style [
style.backgroundColor "yellow"
style.animationName "spin"
style.animationDuration 3
style.animationIterationCount.initial
style.animationTimingFunction.linear
]
prop.children [
Html.h1 $"My name is: {props.name}!"
]
]
Html.style [ prop.text "@keyframes spin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }" ]
]
2 changes: 1 addition & 1 deletion sample-project/index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@
</head>
<body>
<div id="root">
<h1>Static text</h1>
<h1 id="dyn">Static text</h1>
<div id="app"></div>
</div>
<script type="module">
Expand Down
5 changes: 3 additions & 2 deletions sample-project/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,9 @@
"type": "module",
"scripts": {
"dev": "bunx --bun vite",
"build": "bunx --bun vite build",
"preview": "bunx --bun vite preview"
"dev:debug": "VITE_PLUGIN_FABLE_DEBUG=1 bunx --bun vite",
Copy link
Collaborator Author

@jkone27 jkone27 Jun 28, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

added dev debug script

"build": "bunx --bun build",
"preview": "bunx --bun preview"
},
"dependencies": {
"@fable-org/fable-library-js": "2.0.0-beta.3",
Expand Down
2 changes: 1 addition & 1 deletion sample-project/vite.config.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,6 @@ export default defineConfig({
plugins: [
Inspect(),
fable({ jsx: "automatic" }),
react({ include: /\.fs$/ }),
react({ include: /\.fs$/, jsxRuntime: "classic" }),
],
});
Loading