:warning: Unmaintained
This project has been archived and is considered outdated and unmaintained.
With the massive rise of the CLI tools by each major JavaScript Web frameworks, it was become irrelevant to pursue the quest of being a competitive project scaffolder for modern Web project.
We officialy advise to use the coresponding CLI tools for the framework you use:
- create-react-app for React
- Vue CLI for Vue.js
- Angular CLI for Angular
Of course, we have some regrets regarding our users, Yeoman users and some goals we had with Fountain (like giving important tool choices to users, harmonizing projects configurations between frameworks...) but still, you can use official CLI tools with confidence as they are great project which went further for development experience and Web optimization.
Fountain React Generator
This Yeoman generator allows you to start a React web app with the best Developer Experience out of the box!
No matter what framework or module management you want to use, we got you covered with a cutting edge working configuration.
We use Gulp 4 as a task manager but we'll ask you questions about:
- Modules management: Webpack, SystemJS, none
- JS preprocessor: Babel, TypeScript, none
- CSS preprocessor: Sass, Stylus, Less, none
This generator is a sub-generator of the the Yeoman Fountain generator for webapps generator-fountain-webapp.
Generator Fountain React structure
To take profit of the best of the Yeoman infrastructure, we heavily relies on the composability natures of the generators.
Thereby, each needs of your future application will be addressed by a dedicated Yeoman generator (each will be used depending of the options you selected or not).
More informations in DESIGN.md.
Web tooling layer
Module management layer
Usage
Requirement Node 6+ && NPM 3+
This generator is targeted to be used with Node >= 6.0.0 and NPM => 3.0.0. You can check your version number with the command
node --version && npm --version
Install
Install required tools yo:
npm install -g yo
Install generator-fountain-react:
npm install -g generator-fountain-react
Run
Create a new directory, and go into:
mkdir my-new-project && cd my-new-project
Run yo fountain-react, and select desired technologies:
yo fountain-react
Use NPM scripts
npm run buildto build an optimized version of your application in /distnpm run serveto launch a browser sync server on your source filesnpm run serve:distto launch a server on your optimized applicationnpm run testto launch your unit tests with Karmanpm run test:autoto launch your unit tests with Karma in watch mode
Or Gulp tasks
If you have gulp-cli installed in global packages you can use equivalent:
gulporgulp buildgulp servegulp serve:distgulp testgulp test:auto
If you don't have gulp-cli installed in global, you should have this error:
/usr/local/lib/node_modules/gulp/bin/gulp.js:121
gulpInst.start.apply(gulpInst, toRun);
TypeError: Cannot read property 'apply' of undefined
Sub-generators
Few sub-generators are available. You can see the full list by running yo --generators.
Each generator has 2 options:
- You can set the name of the generated item with
--name - You can set the path of the generated item with
--dir
Example:
yo fountain-react:component --name myComponent --dir components/game