Skip to content

vite:react-swc plugin conflict with vite-plugin-conditional-compile #8

@f4-miyata

Description

@f4-miyata

Description:

When using vite-plugin-conditional-compile in a Vite project with the vite:react-swc plugin,
an error occurs during the build process. The vite:react-swc plugin throws a syntax error.

Environment:

  • vite: "^5.2.6"
  • vite-plugin-conditional-compile: "^1.4.5"
  • @vitejs/plugin-react-swc": "^3.6.0"
  • Node: "20.10.0"
  • pnpm: "8.15.5"
  • OS: macOS 13.6.7

Steps to Reproduce:

  1. Install vite-plugin-conditional-compile and vite-plugin-react-swc.
    2.Use conditional compilation in a React component
import React from 'react';
import { Route } from 'react-router-dom';
import { Page } from '@debug/pages/Page';

const AppRoutes = () => {
  return (
    <>
      {/* #if [DEV] */}
      <Route path="/Page" element={<Page />} />
      {/* #endif */}

      <Route path="/Error" element={<ErrorPage />} />
    </>
  );
};

export default AppRoutes;
  1. Run the Vite development server or build the project.

  2. The following syntax error occurs during the build process:

Plugin: vite:react-swc
File: /path/to/project/src/app/AppRoutes.tsx:12:1

SyntaxError: Unexpected token (15:0)
  13 |
  14 |
> 15 | }
     | ^
  16 | </Route>
  17 |
  18 | <Route path="/Error" element={<ErrorPage />} />

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions