CODEWITHSUNDEEP
javascriptreactjsnpm-scripts
chrispytoes
chrispytoes

Reputation: 1899

react-create-app "npm run build" not transpiling JSX

I created a new React project with create-react-app, but when I use npm run build and open the resulting build in a browser (served from my own express application), I get console errors about unrecognized JSX syntax that wasn't transpiled.

Is it supposed to do this automatically out of the box or is there something else I need to do?

edit: project structure

express-application:
  admin (react build output)
  admin-src (create-react-app project source folder)
  ...
  app.js
  project.json
  gulpfile.js

So I use a gulp script to execute npm run build in the admin-src sub-directory, and then it pipes the resulting build out to admin. The admin folder is what the application serves as the client.

Upvotes: 0

Views: 393

Answers (1)

chrispytoes
chrispytoes

Reputation: 1899

Okay I got it working using gulp and gulp-jsx to transpile the resulting build folder before copying it out.

Here is what I came up with:

const gulp = require('gulp');
const jsx = require('gulp-jsx');

gulp.task('build-admin', () => {
  gulp.src('admin-src/build/**/*!(.js)')
    .pipe(gulp.dest('./admin'));
  gulp.src('admin-src/build/**/*.js')
    .pipe(jsx({
      factory: 'React.createClass'
    }))
    .pipe(gulp.dest('./admin'));
});

Upvotes: 1

Related Questions