dzoukr / safer.template Goto Github PK
View Code? Open in Web Editor NEWStrongly opinionated modification of amazing SAFE Stack Template for full-stack development in F#.
License: MIT License
Strongly opinionated modification of amazing SAFE Stack Template for full-stack development in F#.
License: MIT License
Hi
I am currently ran into that problem that I run "yarn run start". The page is coming up and after I change something in the code and vite is supposed to refresh the browser page nothing happens.
my vite.config.js
import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
/** @type {import('vite').UserConfig} */
export default defineConfig({
plugins: [react()],
root: "./src/client",
server: {
port: 8080,
proxy: {
'/api': 'http://localhost:5011',
}
},
build: {
outDir: "public"
}
})
package.json
"devDependencies": {
"@vitejs/plugin-react": "^4.0.0",
"autoprefixer": "^10.4.13",
"postcss": "^8.4.20",
"vite": "^4.3.9"
},
"dependencies": {
"react": "^18.2.0",
"react-dom": "^18.2.0",
"use-sync-external-store": "^1.2.0",
"tailwindcss": "^3.3.2",
"daisyui": "^3.1.5",
"fontawesome": "^5.6.3"
}
first time start
after a change in the page
page reload seems to happen but the browser is not reflecting that change.
Am I using unsupported versions?
With Fable 4 we can mix plain React components with JSX component.
In order to use jsx we need to add Fable option -e .jsx --run vite.
However when I add this option the fable app loses to load App.js at all.
Maybe I'm missing something but it would be awesome if you can add JSX working support .
In the template it could be plain jsx mixed with other divs like:
React.fragment [
toReact <| JSX.jsx $"""<div>Ooo Macarena!</div>"""
Html.div state.Message
.....
I am running a separate backend and have the need to only run and debug the client. How would be the settings for VS Code or JB Rider?
For --serverless, I did run the github flow successfully, where it builds the artifacts at /publish/app-fe and /publish/app.
I don't really know what to do from there.
How do I deploy the SAFEr template app to Azure?
Thanks for making this template available Roman! It looks really interesting, and the changes you've made appeal to some of my inclinations ๐ Unfortunately, I seem to be having an issue with 3.0.0-pre-005 ๐๏ธ
The template runs fine via dotnet run
, but there is a compilation error that breaks intellisense in Rider, resulting in a less-than-ideal development experience.
This is from an unmodified SAFEr template. The sln build fails with the same error:
matt@matt-framework:~/dev$ dotnet new SAFEr -o SAFEr
The template "SAFEr Web App v3.0.0-pre-005" was created successfully.
matt@matt-framework:~/dev$ cd SAFEr/
matt@matt-framework:~/dev/SAFEr$ dotnet tool restore
Tool 'paket' (version '7.1.5') was restored. Available commands: paket
Tool 'femto' (version '0.12.0') was restored. Available commands: femto
Tool 'fable' (version '4.0.0-theta-018') was restored. Available commands: fable
Restore was successful.
matt@matt-framework:~/dev/SAFEr$ dotnet build SAFEr.sln
MSBuild version 17.4.1+9a89d02ff for .NET
Determining projects to restore...
Paket version 7.1.5+e2fe7c693356a5e70a74cc01501f7dc5f8996695
Paket version 7.1.5+e2fe7c693356a5e70a74cc01501f7dc5f8996695
Paket version 7.1.5+e2fe7c693356a5e70a74cc01501f7dc5f8996695
Restoring /home/matt/dev/SAFEr/Build.fsproj
Restoring /home/matt/dev/SAFEr/src/SAFEr.Shared/SAFEr.Shared.fsproj
Restoring /home/matt/dev/SAFEr/src/SAFEr.Client/SAFEr.Client.fsproj
Restoring /home/matt/dev/SAFEr/src/SAFEr.Server/SAFEr.Server.fsproj
Starting full restore process.
Restoring /home/matt/dev/SAFEr/Build.fsproj
Total time taken: 0 milliseconds
Restoring /home/matt/dev/SAFEr/src/SAFEr.Shared/SAFEr.Shared.fsproj
Restoring /home/matt/dev/SAFEr/src/SAFEr.Client/SAFEr.Client.fsproj
Restoring /home/matt/dev/SAFEr/src/SAFEr.Server/SAFEr.Server.fsproj
The last restore was successful. Nothing left to do.
Restoring /home/matt/dev/SAFEr/Build.fsproj
Total time taken: 0 milliseconds
Restoring /home/matt/dev/SAFEr/src/SAFEr.Shared/SAFEr.Shared.fsproj
Restoring /home/matt/dev/SAFEr/src/SAFEr.Client/SAFEr.Client.fsproj
Restoring /home/matt/dev/SAFEr/src/SAFEr.Server/SAFEr.Server.fsproj
The last restore was successful. Nothing left to do.
Total time taken: 0 milliseconds
Paket version 7.1.5+e2fe7c693356a5e70a74cc01501f7dc5f8996695
Restoring /home/matt/dev/SAFEr/src/SAFEr.Shared/SAFEr.Shared.fsproj
Starting restore process.
Total time taken: 0 milliseconds
Restored /home/matt/dev/SAFEr/src/SAFEr.Shared/SAFEr.Shared.fsproj (in 141 ms).
Restored /home/matt/dev/SAFEr/src/SAFEr.Server/SAFEr.Server.fsproj (in 141 ms).
Restored /home/matt/dev/SAFEr/src/SAFEr.Client/SAFEr.Client.fsproj (in 141 ms).
Paket version 7.1.5+e2fe7c693356a5e70a74cc01501f7dc5f8996695
Restoring /home/matt/dev/SAFEr/src/SAFEr.Shared/SAFEr.Shared.fsproj
Starting restore process.
Total time taken: 0 milliseconds
SAFEr.Shared -> /home/matt/dev/SAFEr/src/SAFEr.Shared/bin/Debug/net7.0/SAFEr.Shared.dll
/home/matt/dev/SAFEr/src/SAFEr.Server/Startup.fs(11,9): warning FS0044: This construct is deprecated. InstrumentationKey based global ingestion is being deprecated. Use the AddApplicationInsightsTelemetry() overload which accepts Action<ApplicationInsightsServiceOptions> and set ApplicationInsightsServiceOptions.ConnectionString. See https://github.com/microsoft/ApplicationInsights-dotnet/issues/2560 for more details. [/home/matt/dev/SAFEr/src/SAFEr.Server/SAFEr.Server.fsproj]
FSC : error FS0193: The module/namespace 'Fable.React' from compilation unit 'Fable.React' did not contain the namespace, module or type 'ReactElement' [/home/matt/dev/SAFEr/src/SAFEr.Client/SAFEr.Client.fsproj]
SAFEr.Server -> /home/matt/dev/SAFEr/src/SAFEr.Server/bin/Debug/net7.0/SAFEr.Server.dll
Build FAILED.
/home/matt/dev/SAFEr/src/SAFEr.Server/Startup.fs(11,9): warning FS0044: This construct is deprecated. InstrumentationKey based global ingestion is being deprecated. Use the AddApplicationInsightsTelemetry() overload which accepts Action<ApplicationInsightsServiceOptions> and set ApplicationInsightsServiceOptions.ConnectionString. See https://github.com/microsoft/ApplicationInsights-dotnet/issues/2560 for more details. [/home/matt/dev/SAFEr/src/SAFEr.Server/SAFEr.Server.fsproj]
FSC : error FS0193: The module/namespace 'Fable.React' from compilation unit 'Fable.React' did not contain the namespace, module or type 'ReactElement' [/home/matt/dev/SAFEr/src/SAFEr.Client/SAFEr.Client.fsproj]
1 Warning(s)
1 Error(s)
Time Elapsed 00:00:06.29
Seems to relate to Zaid-Ajaj/Feliz#520. I've played around a bit with dependencies, but not found a solution yet. Any ideas?
Hi, I am not exactly sure what the steps are to deploy this onto azure and test it. I get a sync trigger error.
I would appreciate this greatly, as I am trying to deploy my app using Azure functions soon.
C:\SaferFnTest1\src\SaferFnTest1.Server>func azure functionapp publish SaferFnTest1
Microsoft (R) Build Engine version 17.2.0+41abc5629 for .NET
Copyright (C) Microsoft Corporation. All rights reserved.
Determining projects to restore...
Paket version 6.2.1+c82f25d6c324024cbd231df154a447a117c2546e
Starting restore process.
Total time taken: 0 milliseconds
All projects are up-to-date for restore.
Paket version 6.2.1+c82f25d6c324024cbd231df154a447a117c2546e
Starting restore process.
Total time taken: 0 milliseconds
SaferFnTest1.Shared -> C:\SaferFnTest1\src\SaferFnTest1.Server\bin\publish\SaferFnTest1.Shared.dll
SaferFnTest1.Server -> C:\SaferFnTest1\src\SaferFnTest1.Server\bin\publish\SaferFnTest1.Server.dll
Determining projects to restore...
Restored C:\Users\DoomPirate\AppData\Local\Temp\0xi30wcy.kpl\WorkerExtensions.csproj (in 326 ms).
WorkerExtensions -> C:\Users\DoomPirate\AppData\Local\Temp\0xi30wcy.kpl\buildout\Microsoft.Azure.Functions.Worker.Extensions.dll
Build succeeded.
0 Warning(s)
0 Error(s)
Time Elapsed 00:00:10.61
Getting site publishing info...
Creating archive for current directory...
Uploading 11.09 MB [##############################################################################]
Upload completed successfully.
Deployment completed successfully.
Syncing triggers...
Syncing triggers...
Syncing triggers...
Syncing triggers...
Syncing triggers...
Syncing triggers...
Error calling sync triggers (BadRequest). Request ID = '818823a6-aa49-40d9-b3e1-e5c1bc2dabd7'.
First thanks for the template!
I think I got bit by this template issue dotnet/templating#1168
I was going to test the template so created a folder safer-test
and ran the template but a lot of the paths got manged resulting in errors when running dotnet fake build
- in that issue there is some advice on how to prevent this in the template
I'd be willing to take a look at applying if you want?
With version 2.2.0 I have following problem when running dotnet run
Bundling for development...
Failed to load ./.env.
<i> [webpack-dev-server] [HPM] Proxy created: /api/** -> http://localhost:5000
<i> [webpack-dev-server] [HPM] Proxy created: /socket/** -> http://localhost:5000
C:\GitHub\Startup\app\node_modules\webpack\lib\NormalModule.js:207
throw new TypeError(
^
TypeError: The 'compilation' argument must be an instance of Compilation
at Function.getCompilationHooks (C:\GitHub\Startup\app\node_modules\webpack\lib\NormalModule.js:207:10)
at C:\GitHub\Startup\app\node_modules\webpack\lib\HotModuleReplacementPlugin.js:767:18
at Hook.eval [as call] (eval at create (C:\GitHub\Startup\App\node_modules\tapable\lib\HookCodeFactory.js:19:10), <anonymous>:102:1)
at Hook.CALL_DELEGATE [as _call] (C:\GitHub\Startup\App\node_modules\tapable\lib\Hook.js:14:14)
at C:\GitHub\Startup\App\node_modules\webpack\lib\Compiler.js:1153:29
at Hook.eval [as callAsync] (eval at create (C:\GitHub\Startup\App\node_modules\tapable\lib\HookCodeFactory.js:33:10), <anonymous>:6:1)
at Hook.CALL_ASYNC_DELEGATE [as _callAsync] (C:\GitHub\Startup\App\node_modules\tapable\lib\Hook.js:18:14)
at Compiler.compile (C:\GitHub\Startup\App\node_modules\webpack\lib\Compiler.js:1148:28)
at C:\GitHub\Startup\App\node_modules\webpack\lib\Watching.js:214:19
Almost any app would want to use authentication. While the server side implementation in the template can be just a plug:
let login username password =
if username = "jonh" && password = "123" then
Ok username
else
Error "go away"
the whole plumbing of Fable/Feliz communicating with the server and updating global state (for logged in status, for example) is not very trivial for a beginner and would deserve a simple example. I could only make it work with Elmish, not with the provided sample of useDeferredCallback
Hi, do you maybe know how to run the project from JB Rider?
A declarative, efficient, and flexible JavaScript library for building user interfaces.
๐ Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. ๐๐๐
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google โค๏ธ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.