Hi, cannot use in ts? how should i do?

[seepine]

log

use-count.ts:2  Uncaught ReferenceError: $signal is not defined
    at default (use-count.ts:2:15)
    at _Hot$$App (App.tsx:7:31)
    at @solid-refresh:10:42
    at untrack (chunk-TNBBW3T3.js?v=a09726ce:453:12)
    at Object.fn (@solid-refresh:10:28)
    at runComputation (chunk-TNBBW3T3.js?v=a09726ce:765:22)
    at updateComputation (chunk-TNBBW3T3.js?v=a09726ce:748:3)
    at createMemo (chunk-TNBBW3T3.js?v=a09726ce:258:5)
    at hmrCompWrapper (@solid-refresh:7:20)
    at chunk-TNBBW3T3.js?v=a09726ce:567:12

code

export default () => {
  let count = $signal(1);
  const countAdd = () => {
    console.log('add', count);
    count++;
  };
  return {
    count,
    countAdd,
  };
};

import type { Component } from 'solid-js';
import useCount from './use-count';

const App: Component = () => {
  const { count, countAdd } = useCount();

  return (
    <div>
        {count}
        <button onClick={countAdd}>countAdd</button>
    </div>
  );
};
export default App;

[lxsmnsyc]

did you follow this? https://github.com/lxsmnsyc/solid-labels#typescript

more over, it seems that you don't have the plugin configured?

[seepine]

did you follow this? https://github.com/lxsmnsyc/solid-labels#typescript

more over, it seems that you don't have the plugin configured?

but it work in tsx

const App: Component = () => {
  let count = $signal(1);
  const countAdd = () => {
    console.log('add', count);
    count++;
  };

  return (
    <div>
        {count}
        <button onClick={countAdd}>countAdd</button>
    </div>
  );
};

and use vite

export default defineConfig({
  plugins: [
    solidPlugin(),
    solidLabels({
      disabled: {
        labels: {
          signal: true,
        },
        pragma: {
          '@signal': true,
        },
        ctf: {
          $signal: true,
        },
      },
      filter: {
        include: 'src/**/*.{ts,js,tsx,jsx}',
        exclude: 'node_modules/**/*.{ts,js,tsx,jsx}',
      },
    }),
  ]
});

[lxsmnsyc]

why do you have it disabled though

[seepine]

why do you have it disabled though

sorry, i copy from vite-plugin, and thought this was correct...

now it can run without error, but lost responsiveness, how to use it correctly?

[lxsmnsyc]

It isn't reactive because of the way you pass count to the object. You probably want to use $getter or $get

[seepine]

It isn't reactive because of the way you pass count to the object. You probably want to use $getter or $get

thanks, but maybe i dont know how to use solid-labels, createSignal look like seems simpler..

import { createSignal } from 'solid-js';

export default () => {
  let [count, setCount] = createSignal(1);
  const countAdd = () => {
    setCount(count() + 1);
  };
  return {
    count,
    countAdd,
  };
};

import type { Component } from 'solid-js';
import useCount from './use-count';

const App: Component = () => {
  const { count, countAdd } = useCount();

  return (
    <div>
        {count}
        <button onClick={countAdd}>countAdd</button>
    </div>
  );
};
export default App;

[lxsmnsyc]

which is why I would recommend reading the docs. (in the link I provided)