SolidJS•2y ago•

1 reply

`vite-plugin-solid` ignores/removes `/** @jsxImportSource ... */` pragma comment

I'm trying to use a custom JSX runtime for a single file using the

@jsxImportSource

@jsxImportSource

pragma comment. Unfortunately it seems like that the

vite-plugin-solid

vite-plugin-solid

or maybe the

babel-plugin-jsx-dom-expressions

babel-plugin-jsx-dom-expressions

it uses replaces/ignores/removes these pragmas, so that all JSX functions in the compiled output always call

template

template

function from solid-js.
If I remove the solid plugin from the

vite.config.js

vite.config.js

file, the custom JSX runtime works correctly, but then I don't know how to get Solid to render correctly.

For reference, here is part of the file where I want to treat the JSX as raw XML and render it using the

xml-jsx-runtime

xml-jsx-runtime

package.

/** @jsxRuntime automatic */
/** @jsxImportSource xml-jsx-runtime/runtime */

export const XML = () => {
  return (
    <office:document-meta
      xmlns:meta="urn:oasis:names:tc:opendocument:xmlns:meta:1.0"
      office:version="1.3"
    >
      <office:meta>
        <meta:creation-date>2024-06-02T23:54:02.394823826</meta:creation-date>
      </office:meta>
    </office:document-meta>
  );
};

/** @jsxRuntime automatic */
/** @jsxImportSource xml-jsx-runtime/runtime */

export const XML = () => {
  return (
    <office:document-meta
      xmlns:meta="urn:oasis:names:tc:opendocument:xmlns:meta:1.0"
      office:version="1.3"
    >
      <office:meta>
        <meta:creation-date>2024-06-02T23:54:02.394823826</meta:creation-date>
      </office:meta>
    </office:document-meta>
  );
};

Is there anything I can do to have the

vite-plugin-solid

vite-plugin-solid

not override the custom import? Or is there a different way to achieve the goal in Solid? (this way seems to be supported by

esbuild

esbuild

typescript

typescript

and the

@babel/plugin-transform-react-jsx

@babel/plugin-transform-react-jsx

package)

SolidJS•2y ago•

1 reply

Tim Basel

`vite-plugin-solid` ignores/removes `/** @jsxImportSource ... */` pragma comment

I'm trying to use a custom JSX runtime for a single file using the

@jsxImportSource

@jsxImportSource

pragma comment. Unfortunately it seems like that the

vite-plugin-solid

vite-plugin-solid

or maybe the

babel-plugin-jsx-dom-expressions

babel-plugin-jsx-dom-expressions

it uses replaces/ignores/removes these pragmas, so that all JSX functions in the compiled output always call

template

template

function from solid-js.
If I remove the solid plugin from the

vite.config.js

vite.config.js

xml-jsx-runtime

xml-jsx-runtime

package.

/** @jsxRuntime automatic */
/** @jsxImportSource xml-jsx-runtime/runtime */

export const XML = () => {
  return (
    <office:document-meta
      xmlns:meta="urn:oasis:names:tc:opendocument:xmlns:meta:1.0"
      office:version="1.3"
    >
      <office:meta>
        <meta:creation-date>2024-06-02T23:54:02.394823826</meta:creation-date>
      </office:meta>
    </office:document-meta>
  );
};

/** @jsxRuntime automatic */
/** @jsxImportSource xml-jsx-runtime/runtime */

export const XML = () => {
  return (
    <office:document-meta
      xmlns:meta="urn:oasis:names:tc:opendocument:xmlns:meta:1.0"
      office:version="1.3"
    >
      <office:meta>
        <meta:creation-date>2024-06-02T23:54:02.394823826</meta:creation-date>
      </office:meta>
    </office:document-meta>
  );
};

Is there anything I can do to have the

vite-plugin-solid

vite-plugin-solid

not override the custom import? Or is there a different way to achieve the goal in Solid? (this way seems to be supported by

esbuild

esbuild

typescript

typescript

and the

@babel/plugin-transform-react-jsx

@babel/plugin-transform-react-jsx

package)

`vite-plugin-solid` ignores/removes `/** @jsxImportSource ... */` pragma comment

Similar Threads

`vite-plugin-solid` ignores/removes `/** @jsxImportSource ... */` pragma comment

Similar Threads

Similar Threads

Similar Threads