react-starter

授权协议 Readme
开发语言 JavaScript
所属分类 Web应用开发、 常用JavaScript包
软件类型 开源软件
地区 不详
投 递 者 朱宏爽
操作系统 跨平台
开源组织
适用人群 未知
 软件概览

react-starter

React Starter

A basic template that consists of the essential elements that are required to start building a React (v16.4) application using Webpack (v4).

The template consists of:

  • a typcial project layout structure
  • babel setup and configuration
  • webpack setup and configuration
  • eslint setup and configuration
  • SCSS setup and configuration
  • the main React components to get started

Additionaly, the template provides a development and production webpack configuration.

The template also allows one to include specific plugins as part of build. Please see here for more detail


Developed With


Related Projects

  • react-redux-starter

    A basic template that consists of the essential elements that are required to start building a Single Page Application using React, React Router, Redux, Bootstrap 4, Sass, and Webpack.

  • react-clicker

    A basic React app that allows one to increase, decrease, or reset a counter

  • react-clock-basic

    A basic clock that displays the current date and time

  • react-timer-basic

    A basic timer that will start a countdown based on an input of time in seconds

  • react-timer-advanced

    A basic countdown timer that offers an advanced UI experience

  • react-masterminds

    A basic game of guessing a number with varying degrees of difficulty

  • react-movie-cards

    A basic application that displays a list of movies as a list of cards

  • react-calculator-standard

    A calculator that provides the essential arithmetic operations, an expression builder, and a complete history of all expressions

  • react-bitcoin-monitor

    An app that monitors changes in the Bitcoin Price Index (BPI)

  • react-weather-standard

    A weather application that displays the current weather, daily forecasts, and hourly forecasts based on your current geolocation

  • react-redux-quotlify

    A quote browser and manager that allows one to search famous quotes and save them to a data store.


Getting Started

These instructions will get you a copy of the project up and running on your local machine for development and testing purposes.

Prerequisites

The following software is required to be installed on your system:

  • Node 8.x
  • Npm 3.x

Type the following commands in the terminal to verify your node and npm versions

node -v
npm -v

Install

Follow the following steps to get development environment running.

  • Clone 'react-starter' repository from GitHub

    git clone https://github.com/drminnaar/react-starter.git

    OR USING SSH

    git clone git@github.com:drminnaar/react-starter.git
  • Install node modules

    cd react-starter
    npm install

Build

Build Application

dev prod
npm run build:dev npm run build:prod

Build Application And Watch For Changes

dev prod
npm run build:dev:watch npm run build:prod:watch

Build Application With BundleAnalayzer Plugin Included

dev prod
npm run build:dev:bundleanalyze npm run build:prod:bundleanalyze

After running the above command, a browser window will open displaying an interactive graph resembling the following image:

bundle-analyzer

Run ESlint

Lint Project Using ESLint

npm run lint

Lint Project Using ESLint, and autofix

npm run lint:fix

Run

Run Start

This will run the 'serve:dev' npm task

npm start

Run Dev Server

npm run serve:dev

Run Dev Server With Dashboard

npm run serve:dev:dashboard

The above command will display a dashboard view in your console resembling the following image:

webpack-dashboard

Run Prod Server

This command will build application using production settings and start the application using live-server

npm run serve:prod

Versioning

I use SemVer for versioning. For the versions available, see the tags on this repository.


Authors

 相关资料
  • 问题内容: 我注意到可以这样导入: …或像这样: 第一个导入模块中的所有内容(请参阅:导入整个模块的内容) 第二个仅导入模块导出(请参阅:导入默认值) 似乎这两种方法是不同的,并且根本上是不兼容的。 为什么它们都起作用? 请参考源代码并解释该机制…我有兴趣了解其工作原理。 ES6常规模块信息回答了该问题。 我在问使模块像这样工作的机制。在这里,它似乎与源代码中的 “ hacky”导出机制有关,但尚

  • Starter React Flux Starter-React-Flux generates a well-configured project of React and Flux PWA. TypeScript and JavaScript are supported. npm and yarn are supported. Quick start mkdir my-app && cd my-

  • Minimal React Starter A starter project with React, Babel, and Webpack. This starter is as minimal as possible while still including Babel and Webpack. Create Project git clone git@github.com:ahfarmer

  • Live redux-react-starter This repository contains the minimal app to get started with redux, react, hot-reloading, async function and some other great stuffs. How to yarn 0.18+ must be present on your

  • Documentation Webapp Was Built In: ReactJS Redux Webpack 4 Babel 7 React Material UI Bootstrap 4 SCSS, CSS Support HMR Code Splitting with React.lazy & React.Suspense Code Formatter (Prettier) Eslint

  • REACT COOL STARTER A simple but feature rich starter boilerplate for creating your own universal app. It built on the top of React, Redux, React Router and Express. Includes all the hot stuff and mode