Giter VIP home page Giter VIP logo

create-react-app's Introduction

Deprecated

The project is deprecated. Jarvis now uses Create React app's Custom Templates.

Migration

In order to migrate to a newer react-scripts version:

  • yarn remove @guestyci/guesty-react-scripts
  • yarn add react-scripts@^5.0.1
  • yarn add babel-plugin-transform-react-qa-classes eslint-config-airbnb eslint-config-prettier react-app-rewired customize-cra --dev
  • Create a file called config-overrides.js in the root of the project (where .eslint, .gitignore etc are) and copy-paste the following into it:
const {
  override,
  overrideDevServer,
  addBabelPlugin,
  addWebpackPlugin,
} = require('customize-cra');
const ContextReplacementPlugin = require('webpack').ContextReplacementPlugin;

const supportedLocales = [
  'de',
  'fr',
  'hu',
  'ja',
  'it',
  'es',
  'nl',
  'cs',
  'da',
  'el',
  'hr',
  'pl',
  'ru',
  'sk',
  'pt-br',
  'zh-cn',
];

module.exports = {
  webpack: override(
    // Remove moment locales opt out:
    // https://github.com/facebook/create-react-app/blob/64df135c29208f08a175c941a0e94d9a56d9e4af/packages/react-scripts/config/webpack.config.js#L728
    config => {
      config.plugins = config.plugins.filter(
        plugin => 'IgnorePlugin' !== plugin.constructor.name
      );
      return config;
    },
    addWebpackPlugin(
      new ContextReplacementPlugin(
        // eslint-disable-next-line no-useless-escape
        /moment[\/\\]locale/,
        new RegExp(
          `[/\\\\](${supportedLocales
            .map(locale => `${locale}(\\.js)?`)
            .join('|')})$`
        )
      )
    ),
    process.env.NODE_ENV !== 'production' &&
      addBabelPlugin('babel-plugin-transform-react-qa-classes'),

    process.env.NODE_ENV !== 'production' &&
      process.env.PORT &&
      function(config) {
        config.output = {
          ...config.output,
          publicPath: `http://localhost:${process.env.PORT}/`,
        };

        return config;
      }
  ),
  devServer: overrideDevServer(
    process.env.REACT_APP_IN_LDE &&
      function(config) {
        config.headers = {
          ...config.headers,
          'Access-Control-Allow-Origin': '*',
        };
        return config;
      }
  ),
};
  • cat <<< $(jq '.scripts += {start:"ESLINT_NO_DEV_ERRORS=true react-app-rewired start", build:"react-app-rewired build"}' package.json) > package.json
  • Upgrade Circle CI node docker image to version 12 (.circleci/config.yml). If you don't mind which minor version it will have 12.16.3 will work.
  • Upgrade Circle CI cypress docker image to version 12 (.circleci/config.yml).

If you encounter any issue with the migration, please #contact-platform-fe

Breaking changes:

CLUSTER and GUESTY_ENV are no longer passed to the build.

Guesty's Create React App

Guesty's fork configurations for Create-react-app

For general knowledge please refer to - User Guide
On how to develop apps bootstrapped with Create React App.

Quick Overview

There are multiple versions of the apps. Please take care of what and where you change

CLI

This is the most common usage of our tool provided to compliment our jarvis cli tool

branch name: feature/cli

To publish - run:

yarn publish --tag cli

None cli generated apps

For all the older apps which were not generated via the cli.
branch name: 'master'

To publish - run:

yarn publish

How to Deploy

CRA apps are complex, the deployable section is the react-scripts and ONLY the react-scripts folder.

To deploy:

  1. clone the repo
  2. make your changes (to react-scripts)
  3. from react-scripts folder run :
yarn publish --tag cli

How to update:

Periodically we might want to update our CRA fork and align it with the original (upstream) master.

Before you do that, Be EXTREMELY careful, we have made changes to CRA, make sure they are not overridden.

to update: with some sort of merge tool, compare upstream/master with our feature/cli.

Run the app locally and test it

only then push and deploy.

create-react-app's People

Contributors

gaearon avatar timer avatar jonathanyehie avatar selbekk avatar iansu avatar fson avatar ianschmitz avatar vjeux avatar viankakrisna avatar giltab avatar mxstbr avatar tharakawj avatar amyrlam avatar jeffposnick avatar brunolemos avatar andriijas avatar enoahnetzach avatar existentialism avatar arcanis avatar ro-savage avatar tuchk4 avatar sidoshi avatar ryansully avatar greengremlin avatar bondz avatar n3tr avatar johann-sonntagbauer avatar lacker avatar mareksuscak avatar petetnt avatar

Watchers

James Cloos avatar Jonathan Yehie avatar Avishay Maor avatar Slavik Jacobson avatar

Forkers

alexadvise

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.