Before you start, make sure you have a recent version of NodeJS environment >=6.0 with NPM 3 or Yarn. You will also need babel7 cli installed globally.
From the project folder, execute the following commands:
npm install # or: yarn install
This will install all required dependencies, including a local version of Webpack that is going to build and bundle the app. There is no need to install Webpack globally.
To run the app execute the following command:
npm start # or: yarn start
This command starts the webpack development server that serves the build bundles. You can now browse the skeleton app at http://localhost:8080 (or the next available port, notice the output of the command). Changes in the code will automatically build and reload the app.
Running with Hot Module Reload
If you wish to try out the experimental Hot Module Reload, you may run your application with the following command:
npm start -- webpack.server.hmr
Most of the configuration will happen in the
There, you may configure advanced loader features or add direct SASS or LESS loading support.
To transpile (output to /dist) execute:
Running The Tests
This skeleton provides three frameworks for running tests.
You can choose one or two and remove the other, or even use all of them for different types of tests.
Jest is a powerful unit testing runner and framework.
It runs really fast, however the tests are run under NodeJS, not the browser.
This means there might be some cases where something you'd expect works in reality, but fails in a test. One of those things will be SVG, which isn't supported under NodeJS. However, the framework is perfect for doing unit tests of pure functions, and works pretty well in combination with
To create new Jest tests, create files with the extension
.test.js, either in the
src directory or in the
To run the Jest unit tests, run:
To run the Jest watcher (re-runs tests on changes), run:
npm start -- test.jest.watch
Karma + Jasmine
Karma is also a powerful test runner, and combined with Jasmine it can be a pleasure to work with. Karma always runs in the browser. This means that whatever works in real browsers, should also work the same way in the unit tests. But it also means the framework is heavier to execute and not as lean to work with.
To create new Karma tests, create files with the extension
.spec.js, either in the
src directory or in the
To run the Karma unit tests, run:
npm start -- test.karma
To run the Karma watcher (re-runs tests on changes), run:
npm start -- test.karma.watch
Protractor (E2E / integration tests)
Integration tests can be performed with Protractor.
Place your E2E-Tests into the folder
test/e2eand name them with the extension
Run the tests by invoking
npm start -- e2e
Running all test suites
To run all the unit test suites and the E2E tests, you may simply run:
npm start -- test.all