Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Different results with CLI or with mitosis.config.js

See original GitHub issue

Hello, For sure I’m doing something wrong but I’m having different results using mitosis.config.js than the cli.

module.exports = {
  files: 'src/**/*.lite.tsx',
  dest: 'packages',
  options: {},
  targets: ['react', 'html', 'angular']

This generates compiled JS files not components.

but using commands like:

mitosis compile --to=react src/button/button.lite.tsx > packages/react/src/button/button.lite.jsx

Generates the expected component. I’was digging into the docs and config options but I cannot find how to using the config file I can have the same result, I don’t need the code compiled I’m good with just the components.

Sorry for not understanding this, if not possible no problem I’ll use the CLI commands into npm scripts and done

Issue Analytics

  • State:closed
  • Created a year ago
  • Comments:8 (3 by maintainers)

github_iconTop GitHub Comments

samijabercommented, May 26, 2022

One thing I noticed: mitosis build and mitosis compile are different commands that do different things:

  • mitosis compile is a much simpler command: it takes 1 file and outputs it to one target.
  • mitosis build will handle an entire directory, which may include non-mitosis JS/TS files etc.

You have been interchanging the two, so I believe that’s where the discrepancy lies. Looking at, you were using mitosis build, but in this issue, you’re comparing its output to that of mitosis compile. So the issue is not CLI vs mitosis.config.js, it’s build vs compile.

My thing was that I wanted to manage the transpilation by myself

Yup, I hear you! That’s exactly what we’ve realized as well while generating react-native code. We’re open to remove the transpile step I linked to in the previous comment, and leaving that off to the end-user. Alternatively, we can move it behind a shouldTranspileComponent: boolean flag for react/react-native configurations.

samijabercommented, Sep 20, 2022

@ixTec This has indeed been solved. If you provide a typescript: true boolean to a generator’s options, then it will return the original, non-transpiled component:


// mitosis.config.js
module.exports = {
  files: 'src/**',
  targets: ['reactNative', 'vue2', 'vue3', 'solid', 'svelte', 'react', 'qwik'],
  options: {
    react: {
      typescript: true,
      stylesType: 'style-tag',
    qwik: {
      typescript: true,
    svelte: {
      typescript: true,
Read more comments on GitHub >

github_iconTop Results From Across the Web

CLI: toggle JS/TS output · Issue #511 · BuilderIO/mitosis
We want to add some logic to toggle TS output on/off in the CLI commands, and select .ts / .js (or .jsx /...
Read more >
Intro to Mitosis: The universal reactive transformer
Mitosis is the JavaScript compiler that lets developers "write once, run anywhere," then compile to Angular, Vue, Svelte, and more.
Read more >
Same vue.config.js producing different results when ...
Solution: Putting a symlink inside of the project root and altering webpack. config. json (resolve: {symlinks: false}) fixed this issue.
Read more >
A Quick Guide to Mitosis: Why You Need It and How You ...
Mitosis is a compile-time framework that allows you to write components in JSX and compile to vanilla JavaScript, Angular, React, Vue and more....
Read more >
Mitosis CLI
Known issues · Running mitosis from the root of this repository breaks due to some dynamic babel configuration look up · Files that...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found