Commenting out some JSX code section with Emacs 27 js-mode

Commenting out some JSX code section with Emacs 27 js-mode

[Christian Jauvin]

[-- Attachment #1: Type: text/plain, Size: 845 bytes --]

Hi everyone,

When I comment out (`M-x comment-dwim`) some section of JSX code with the
new js-mode in Emacs 27, it gives:

// <Grid rows={rows} columns={columns}>
//   <Table />
//   <TableHeaderRow />
// </Grid>

Is there any way to make js-mode behave like it does with rjsx-mode:

{/* <Grid rows={rows} columns={columns}> */}
{/*   <Table /> */}
{/*   <TableHeaderRow /> */}
{/* </Grid> */}

Supposing that this is not currently possible, and that js-mode is really
the way to go forward for JS/JSX code (from the older rjsx-mode and
js2-mode, as I vaguely understand), where could I begin to study the code
and possibly suggest a pull request to make it work? I tried to find a few
tutorials dedicated to programming modes but it's not obvious how to adapt
it to this particular problem.

Any help or advice would be appreciate,

Christian

[-- Attachment #2: Type: text/html, Size: 1063 bytes --]

Re: Commenting out some JSX code section with Emacs 27 js-mode

[Stefan Monnier]

> Is there any way to make js-mode behave like it does with rjsx-mode:
>
> {/* <Grid rows={rows} columns={columns}> */}
> {/*   <Table /> */}
> {/*   <TableHeaderRow /> */}
> {/* </Grid> */}

(add-hook 'js-mode-hook
          (lambda ()
            (setq-local comment-start "{/* ")
            (setq-local comment-end   " */}")))


-- Stefan

Re: Commenting out some JSX code section with Emacs 27 js-mode

[Christian Jauvin]

[-- Attachment #1: Type: text/plain, Size: 568 bytes --]

>
> (add-hook 'js-mode-hook
>           (lambda ()
>             (setq-local comment-start "{/* ")
>             (setq-local comment-end   " */}")))
>

It now works for JSX, but breaks on regular JS code (inside the same .jsx
file):

const [open, setOpen] = React.useState(false);
const [options, setOptions] = React.useState([]);

becomes:

{/* const [open, setOpen] = React.useState(false); */}
{/* const [options, setOptions] = React.useState([]); */}

Would there be a way for the comment function to know whether it is in a
JSX block or not, and act accordingly?

[-- Attachment #2: Type: text/html, Size: 984 bytes --]

Re: Commenting out some JSX code section with Emacs 27 js-mode

[Stephen Leake]

Christian Jauvin <cjauvin@gmail.com> writes:

>>
>> (add-hook 'js-mode-hook
>>           (lambda ()
>>             (setq-local comment-start "{/* ")
>>             (setq-local comment-end   " */}")))
>>
>
> It now works for JSX, but breaks on regular JS code (inside the same .jsx
> file):

You need to change js-mode to use the ELPA package mmm-mode (multi-major-mode).


-- 
-- Stephe