时间戳

首页 > 解决方案 > sublime JsFormat - React.js 格式化

javascript - sublime JsFormat - React.js 格式化

问题描述

我刚开始学习反应开发，我对反应很陌生。我已经使用create-react-app工具创建了一个反应应用程序并为 sublime text 3 安装了 jsFormat 插件，但它错误地格式化了 jsx 文件：

格式化前：

App.js 文件：

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  render() {
    return (
      <div className='App'>
        <header className='App-header'>
          <img src={logo} className='App-logo' alt='logo' />
          <h1 className='App-title'>Welcome to React</h1>
        </header>
        <p className='App-intro'>
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
      </div>
    );
  }
}

export default App;

jsFormat 格式化 App.js 文件后：

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  render() {
    return ( <
      div className = 'App' >
      <
      header className = 'App-header' >
      <
      img src = { logo } className = 'App-logo'
      alt = 'logo' / >
      <
      h1 className = 'App-title' > Welcome to React < /h1> <
      /header> <
      p className = 'App-intro' >
      To get started, edit < code > src / App.js < /code> and save to reload. <
      /p> <
      /div>
    );
  }
}

export default App;

我应该在 JsFormat 设置中添加/更改哪些设置以使其正确格式化 jsx 文件？

标签： javascriptreactjsformatsublimetext3jsx

解决方案

将此添加到 JsFormat 设置修复了问题：

"e4x": true

推荐阅读