Open wangxg422 opened 1 month ago
When using tauri v2 + solidjs + vite to develop app, solidjs-labels does not work.
My configuration is as follows:
import { defineConfig } from "vite"; import solid from "vite-plugin-solid"; import solidPlugin from "vite-plugin-solid"; import solidLabels from "babel-plugin-solid-labels"; import path from "path"; const host = process.env.TAURI_DEV_HOST; // https://vitejs.dev/config/ export default defineConfig(async () => ({ plugins: [ solid(), solidPlugin({ babel: { plugins: [ [ solidLabels, { dev: false, disabled: { labels: { signal: true, }, pragma: { "@signal": true, }, ctf: { $signal: false, }, }, filter: { include: 'src/**/*.{ts,js,tsx,jsx}', exclude: 'node_modules/**/*.{ts,js,tsx,jsx}', }, }, ], ], }, }), ],
My component is as follows:
import { createSignal, type Component } from "solid-js"; const Home: Component = () => { let [process, setProcess] = createSignal(10); let process2 = $signal(10); const changeProcess = (e: Event) => { const target = e.target as HTMLInputElement; setProcess(parseInt(target.value)); }; const clickBtn = () => { setProcess(process() + 10); }; const changeProcess2 = (e: Event) => { const target = e.target as HTMLInputElement; console.log(target.value) process2 = parseInt(target.value); }; const clickBtn2 = () => { process2 = process2 + 10; }; return ( <div class="w-full h-full flex justify-center items-center"> <div class="w-full h-1/4"> <button class="btn btn-success" onClick={clickBtn}> 确定 </button> <input type="range" min="0" max="100" value={process()} class="range" onChange={changeProcess} /> <div> <span>{process()}</span> </div> </div> <div class="w-full h-1/4"> <button class="btn btn-success" onClick={clickBtn2}> 确定 </button> <input type="range" min="0" max="100" value={process2} class="range" onChange={changeProcess2} /> <span>{"process2:" + process2}</span> </div> </div> ); }; export default Home;
I would just recommend using the vite plugin rather than the babel plugin directly.
When using tauri v2 + solidjs + vite to develop app, solidjs-labels does not work.
My configuration is as follows:
My component is as follows: