Structure

Last updated 5 months ago

In the previous component archetype, we used demo-server to demo and test the React component inside of the component itself, which adds a risk of confusion. To clarify, we removed demo-server for the component archetype to target the build, eslint check, and unit tests.

At the same time, in the new electrode components, we demonstrate components using <repo>/demo-app where we import components from <repo>/packages/<componentName>. The latest electrode components can be generated by the latest electrode-generator.

The new structure of the Electrode React Component Archetype is shown below.

- electrode-archetype-react-component
|- config/
| |- babel
| |- browser_test
| |- dependencies
| |- eslint
| |- istanbul
| |- karma
| |- stylint
| |- webpack
| |- partial
| |- babel.js
| |- define.js
| |- fonts.js
| |- images.js
| |- json.js
| |- optimize.js
| |- sourcemaps.js
| |- styles.js
| |- webpack.config.coverage.js
| |- webpack.config.dev.js
| |- webpack.config.js
| |- webpack.config.test.js
| |- archetype.js
|- scripts/
|- archetype-clap.js
|- xclap.js
|- package.json
...

The Component Archetype still provides babel, eslint, karma and webpack configuration files as before, and the files can be found in the electrode-archetype-react-component/config directory. But there are some updates for the webpack configuration files, which can be found in the Webpack Configuration section.