Is there a Discord, or Slack channel to discuss?

Is your feature request related to a problem? Please describe.
There is significant gap in the documentation that details creating components and containers from scratch. I'm finding myself running into error after error using this library because I'm stumbling through the process trying to figure out how to setup a new container and component.

Describe the solution you'd like
In the quick start guide add a section that details how to use the generator to create a new component and container. It doesn't have to be anything fancy but it needs to go through the workflow and show the reader the steps involved in this process after running the npm run cleanAndSetup command.

Describe alternatives you've considered
Just using react-boilerplate as is, and adding in Typescript myself.

Additional context
I'm thinking something as simple as adding in a div that does an api request:

1. npm run generate component
   ...details
2. npm run generate container
   ...details
3. Update container slice with initial state
   ... details
   ... more steps (I'm not sure what these next steps are as I'm still struggling trying to figure them out)

Final step add to HomePage

Description

After removing example app and generating a container PLOP.
Project fails to compile Typescript.

Steps to reproduce

npx create-react-app --template cra-template-rb my-app
cd my-app
npm run cleanExampleApp
npm run generate

[PLOP] Please choose a generator. container - Add a container component

• What should it be called? Form
• Do you want to wrap your component in React.memo? No
• Do you want headers? No
• Do you want a redux slice(actions/selectors/reducer) for this container? Yes
• Do you want sagas for asynchronous flows? (e.g. fetching data) Yes
• Do you want to use styled-components? Yes
• Do you want i18n translations (i.e. will this component use text)? No
• Do you want to load the component asynchronously? No
• Do you want to have tests? No

npm start

Failed to compile.
/src/app/containers/Form/index.tsx(19,37):
Type 'Reducer<FormState, AnyAction>' is not assignable to type 'Reducer<FormState | undefined, AnyAction>'.
  Type 'FormState | undefined' is not assignable to type 'FormState'.
    Type 'undefined' is not assignable to type 'FormState'.  TS2322

    17 |
    18 | export function Form(props: Props) {
  > 19 |   useInjectReducer({ key: sliceKey, reducer: reducer });
       |                                     ^
    20 |   useInjectSaga({ key: sliceKey, saga: formSaga });
    21 |
    22 |   // eslint-disable-next-line @typescript-eslint/no-unused-vars

Expected behavior
PLOP for new container does not fail to compile Typescript.

Versions

• react-boilerplate-cra-template: v0.1.0
• Node/NPM: v12.16.1
• Browser: Chrome v81.0.4044.122

Describe the solution you'd like
I believe supporting storybook would be a great addition to the boilerplate

I think redux-persist helps us to store data that needs to be used by localStorage

To push to different location this is what I used.

function forwardTo(location) {
  console.log("location", history, location);
  history.push(location);
}

yield call(forwardTo, "/");

This just changes the url but not renders the component for that route.

I saw the line "connected-react-router" is not needed so I am not aware how it can be done without it.

Description

when you just clone then project and build project after then start using serve or start in domain. service worker is running and also build do not create sw.js file also.
A clear and concise description of what the bug is.

Steps to reproduce

when you just clone then project and build project after then start using serve or start in domain. then open domain in google chrome and check in application tab no service worker will be there for this website.
Steps to reproduce the behavior:

Expected behavior
service worker should be there and registered in application tab of google chrome. because of that only used files should be fetched from server only.

Versions

latest just download

• react-boilerplate-cra-template: latest
• Node/NPM: 12
• Browser: google chrome

I can see there is .env.local and .env.production. I want to use the env variables in my project with process.en.{name}. If I add a new variable to .env and npm start then it doesn't work. What do I need to configure to get it worked?

Currently, I got two issues:

1. Usage of css prop
2. Typescript error

Ref: https://styled-components.com/docs/api#css-prop

Before opening a new issue, please take a moment to review our community guidelines to make the contribution process easy and effective for everyone involved.

Description

Warning appears:

index.js:1 Warning: Cannot update a component from inside the function body of a different component.
    in Unknown (at loadable.tsx:27)
    in Suspense (at loadable.tsx:26)
    in Unknown (created by Context.Consumer)
    in Route (at App/index.tsx:96)
    in Switch (at App/index.tsx:95)
    in div (created by styled__MainWrapper)
    in styled__MainWrapper (at App/index.tsx:94)
    in div (created by styled__AppWrapper)
    in styled__AppWrapper (at App/index.tsx:86)
    in Unknown (at src/index.tsx:46)
    in HelmetProvider (at src/index.tsx:44)
    in Router (created by ConnectedRouter)
    in ConnectedRouter (created by Context.Consumer)
    in ConnectedRouterWithContext (created by ConnectFunction)
    in ConnectFunction (at src/index.tsx:43)
    in Provider (at src/index.tsx:42)
    in ConnectedApp (at src/index.tsx:53)

A clear and concise description of what the bug is.
I think lazyLoad is problem
Steps to reproduce the behavior:

(Add link to a demo on https://jsfiddle.net or similar if possible)

Steps to reproduce

• Start example app
• Add useEffect hook with empty handler to stateless component (NotFoundPage for example)
• Observe component rendering

Expected behavior
Component render once

Versions

• react-boilerplate-cra-template: 0.1.2
• Node/NPM: 12.16.1/6.13.4
• Browser: Chrome 81

Before opening a new issue, please take a moment to review our community guidelines to make the contribution process easy and effective for everyone involved.

Description

in the erpo example src/locales/i18n.ts

export type LanguageKey = keyof TranslationResource;

in the starting template internals same location

export type LanguageKeys = keyof TranslationResource;

Versions

• react-boilerplate-cra-template: v0.1.3
• Node/NPM:
• Browser:

Description

The documentation currently hosted on gitbook.io is generally good but could be improved by addressing issues such as:

• Inconsistent style of package names in text; all should be enclosed in backticks.

• Inconsistent use of paragraph-per-line convention. Some sentences are split across lines. Addressing this will help automated grammar tools be effective.

• Some bare links in text, where they are just clutter. Markdown link with alt text should be used consistently.

• Numerous grammatical issues such as incorrect use of tense and ordinal agreement. Example from "Building Blocks":

  In this section we are going to explain the building blocks of the boilerplate in details.

  This would be better as:

  In this section, we will explain the building blocks of the boilerplate in detail

• Grammar: Use of "its" for the contraction of "it is", should be "it's".

• Inconsistent capitalization of project names, e.g., "redux" and "react.

• Grammar: Missing and misplaced punctuation.

• Paragraph-quotes used in place of {% hint %} tags in several files.

Steps to reproduce

View the production documentation on gitbook.io](https://cansahin.gitbook.io/react-boilerplate-cra-template).

Expected behavior

The documentation should be both technically and semantically correct. To be accessible to users whose English may not be strong, complex sentences should be avoided. The style of presentation should be consistent throughout the docs so users find it familiar.

NOTE: A Gitbook of the proposed changes is available for review on gitbook.com. (The changes are on my fork of the repo.

Screenshots
n/a

Versions

• react-boilerplate-cra-template: 1.0.1
• Node/NPM: n/a
• Browser: n/a

Hello,

Perhaps a good addition to this repo would be to somehow outline how one would change RootState from within a sub-component saga (GitHubRepoForm for example).

I think the most simple answer involves changing ./internals/startingTemplate/src/utils/types/injector-typings.ts to incorporate the full RootState but perhaps I am incorrect in this assumption?

Thanks

Looking at the sample page (https://react-boilerplate.github.io/react-boilerplate-cra-template/) or generating an example app from scratch, I noticed location event fired twice using Redux tool.

Is there any cause for concern?

I found this project https://miami-dev-shop.gitbook.io/saga-slice/ the other day and wanted to bring it to your attention.

It main benefit is, that it streamlines the communication between reducers and sagas, which leads to much less boilerplate code. Its usage is pretty similar to redux-toolkit, exspect for the saga part of course.

On the con side, while it is actively maintained, it has not the same community around as redux-toolkit.

Is your feature request related to a problem? Please describe.
I'm using react-router without hash # and when I deploy by Nginx, so every f5 it's throw 404.

Describe the solution you'd like
Can you give me any way to solve it without using hash #?

Describe alternatives you've considered
So anyway to provide a server express manual to handle this problem?

Before opening a new issue, please take a moment to review our community guidelines to make the contribution process easy and effective for everyone involved.

Description

It's a small thing, but it could save someone else time in the future. At the moment both the component generator script internals/generators/component/index.ts and the container generator script internals/generators/container/index.ts use the variable name containerPath. This unexpected naming led to a tiny mixup when customizing the generators. To avoid this happening to someone else, I propose that containerPath is renamed componentPath in the component generator.

Steps to reproduce

Steps to reproduce the behavior:

Take a dev and ask him to change the behavior of internals/generators/container so that it generates a view instead of a container. Whether the dev renames en masse container to view or not, during the code review someone will inevitably point out either the reference to containerPath (if no en masse renaming was done) or the reference to viewPath (if en masse remaining was done), in internals/generators/component.

Expected behavior
It seems to me that the variable should be containerPath in container and componentPath in component.

Versions

• react-boilerplate-cra-template: 1.0.1
• Node/NPM: 14.11.0/6.14.8
• Browser: N/A

When a windows team-member went to run the application, he encountered the following error:

We have a fix, will submit a PR

Is your feature request related to a problem? Please describe.
There is no clear documentation on how to include redux-persist or similar solutions for preserving redux states on refresh and the guidelines don't seem to work with redux-persist in particular.

Describe the solution you'd like
I would like some guidance/a documented solution on how to include such solution in a react-boilerplate projectl

Describe alternatives you've considered
There are alternative libraries such as redux-persist-immutable which don't seem to work with new react-boilerplate versions.

Is your feature request related to a problem? Please describe.
The justification laid out on the docs here: https://cansahin.gitbook.io/react-boilerplate-cra-template/understanding-react-boilerplate
for using a container pattern links specifically to this article:
https://medium.com/@dan_abramov/smart-and-dumb-components-7ca2f9a7c7d0

That article now has an update from Dan Abramov saying he believes this pattern shouldn't be used anymore thanks to hooks.

Describe the solution you'd like
A starter structure and generator that instead utilizes hooks and presents an example of how to use them without requiring a container pattern.

Let's take the HomePage component for an example.

• How do you decide whether to put a styled-component in the components folder (example: src/app/containers/HomePage/components/Lead.ts), or directly inside the .tsx file of a component using it? (example: Content of src/app/containers/HomePage/Features.tsx, or Wrapper of src/app/containers/HomePage/Logos.tsx)? As I understand it, most dumb components go to the components folder, and only some wrappers or slight changes go directly to the component's file?

Thank you kindly for your time.

Description

After creating a new application with cra-template-rb template and starting the app everything works fine. However, when I run the cleanAndSetup script I get a Typescript compile time error in serviceWorker.ts

src/serviceWorker.ts:31:31 - error TS2345: Argument of type 'string | undefined' is not assignable to parameter of type 'string'.
  Type 'undefined' is not assignable to type 'string'.

Steps to reproduce

Steps to reproduce the behavior:

npm run eject
npm run cleanAndSetup
npm run checkTs

Expected behavior

Either of these (not exhaustive):

1. cleanAndSetup script should create a default PUBLIC_URL to avoid Typescript error.
2. cleanAndSetup script should prompt user for new PUBLIC_URL to avoid Typescript error.
3. Update documentation to detail how to manually create PUBLIC_URL to avoid Typescript error.

Versions

• react-boilerplate-cra-template: 1.0.1
• Node/NPM: 12.16.1/6.13.4
• Browser: N/A

Description

When building, app throw an error

Failed to compile.
Cannot find file '......./node_modules/babel-preset-react-app/node_modules/@babel/runtime/helpers/esm/toConsumableArray' in './src/store'.

I installed @babel/runtime and it works.

Firstly awesome project!

I notice that you are using https://github.com/supasate/connected-react-router Interestingly enough the https://reactrouter.com/web/guides/deep-redux-integration website mentioned that you shouldn't store the Router state in redux. They mentioned not to keep your routes in your Redux store at all and explains the reasoning on that.

Is your feature request related to a problem? Please describe.
Heroku deployment of react-boilerplate-cra-template

Describe the solution you'd like

• steps:
  • run this command
    npx create-react-app --template cra-template-rb my-app
  • create a procfile

    web: npm run start:prod
    

  • run command, heroku create, using heroku cli
  • run basic git commit command
  • run git push heroku master
  • it got deployed on heroku server.

Describe alternatives you've considered
demo: https://polar-peak-91443.herokuapp.com/

Additional context
Add any other context or screenshots about the feature request here.

eslint config:

const fs = require('fs');
const path = require('path');

const prettierOptions = JSON.parse(
  fs.readFileSync(path.resolve(__dirname, '.prettierrc'), 'utf8'),
);

module.exports = {
  extends: [
    'react-app',
    'prettier',
    'prettier/react',
    'prettier/@typescript-eslint',
  ],
  plugins: ['prettier'],
  rules: {
    'prettier/prettier': ['error', prettierOptions],
    'react-hooks/exhaustive-deps': 'off',
  },
  overrides: [
    {
      files: ['**/*.ts?(x)'],
      rules: { 'prettier/prettier': ['warn', prettierOptions] },
    },
    {
      files: ['**/*.ts?(x)'],
      rules: {
        'react-hooks/exhaustive-deps': 'off'
      }
    }
  ],
};

still produces this error in the console:

Line 28:6: React Hook useEffect has a missing dependency: 'dispatch'. Either include it or remove the dependency array react-hooks/exhaustive-deps

Steps to reproduce

• Initialize and run cleanExampleApp script
• Create any syntax error in HomePage/index.tsx
• Stage changes and commit

Expected behavior
Fail to commit and throw linting error

Versions

• react-boilerplate-cra-template: 0.1.0
• Node/NPM: 12.16.1/6.13.4

Do you nest containers within containers? For example, if HomePage included a bunch of complex container components that are used nowhere else, would you nest it such as src/app/containers/HomePage/containers/SomeNestedContainer1?

For example:
It would make sense to me that, if for example, GithubRepoForm is used only inside HomePage, then it should reside under HomePage/containers (and be lifted if we, in future, need to use it somewhere else). At least to me, it feels cleaner than tossing literally all the container components we have into the app/containers directory (at some point, we're gonna have hundreds of them there), yet you've chosen to keep GithubRepoForm in app/containers, instead of app/containersHomePage/containers, despite it being a part of HomePage.

Thank you for any and all explanations. My project tend to turn messy after a while, so I'd really appreciate having explained why you've taken this way and why it's better.

Description

When I import the history object like so:
import { history } from 'utils/history';

And then do
history.push('/route')
The window location updates but the new container at "/route" is not loaded.

Expected behavior
I should be able to push to a new location using history.push and have the proper container loaded for me.

Right now offline support is not well if added to homescreen in mobiles. Any luck with that?

I'd like to ask a question whether react-i18next provides us a way to define messages as react-intl

Or any suggestions of how we structure and extract messages with react-i18next effectively.

Thanks in advance!

Before opening a new issue, please take a moment to review our community guidelines to make the contribution process easy and effective for everyone involved.

Description

When running a command (e.g. npm run generate) node shows a bunch of warnings (Warning: Accessing non-existent property 'cd' of module exports inside circular dependency)

Steps to reproduce

1. Create a new project (npx create-react-app --template cra-template-rb my-app)
2. Run npm run cleanAndSetup
3. Run npm run generate

Expected behavior
A neat and clean output.

Screenshots

Versions

{
  'bipro-model-documentation-frontend': '0.1.0',
  npm: '6.14.5',
  ares: '1.16.0',
  brotli: '1.0.7',
  cldr: '37.0',
  icu: '67.1',
  llhttp: '2.0.4',
  modules: '83',
  napi: '6',
  nghttp2: '1.41.0',
  node: '14.5.0',
  openssl: '1.1.1g',
  tz: '2019c',
  unicode: '13.0',
  uv: '1.38.0',
  v8: '8.3.110.9-node.23',
  zlib: '1.2.11'
}

• react-boilerplate-cra-template: master?
• Node/NPM: v14.5.0/6.14.5
• Browser: N/A (84.0.4147.89 (Official Build) (64-bit))
  --

Relevant issue: facebook/create-react-app#8498

With husky enabled CRA cannot create a git repository when you install the template. Therefore, it needs to be disabled at first and then when user cleans the example app it should be enabled

So while using this CRA template I want some containers to have only one saga file which could act like a Global Saga so I don't have to write same function in every container's saga. So I was able to implement a global Reducer following this info
https://github.com/react-boilerplate/react-boilerplate/blob/master/docs/general/gotchas.md#load-reducers-optimistically
but I'm unable to find a way to inject a saga Globally. I actually researched a lot and found a way but it don't seem to work here but I guess it works in Original Boilerplate without TS but I'm not sure if it works there even.
So the solution which I found was given by @joshuaalpuerto and @julienben and here is that discussion's link https://spectrum.chat/react-boilerplate/general/best-practices-for-app-wide-sagas~47d41658-32a8-4948-8283-0ba66b071aa3
and what these guys were actually doing was rendering a component from App Component which renders null and injects those global reducer and global saga the way I want but when I do this and run the App it just keeps loading and ultimately becomes unresponsive and also I'm unabl Also I tried injecting these reducer and saga into App component but the outcome is same and if I don't inject these reducer and saga, then app seems to work fine. This is how my component looks like:

import { SagaInjectionModes, useInjectSaga, useInjectReducer} from 'redux-injectors';
import { globalSaga } from './saga';
import { sliceKey, reducer } from './slice';

function Root() {
  useInjectSaga({
    key: sliceKey,
    saga: globalSaga,
    mode: SagaInjectionModes.DAEMON,
  });
  useInjectReducer({ key: sliceKey, reducer: reducer });
  return null;
}
export default Root;

And this is how I'm rendering it in my App Component

import * as React from 'react';
import { Helmet } from 'react-helmet-async';
import { Switch, Route } from 'react-router-dom';
import GlobalRoot from 'app/containers/Root';

// Other component imports....

export function App() {
  return (
    <>
      <Helmet
        titleTemplate="%s - React Boilerplate"
        defaultTitle="Sample App"
      >
        <meta name="description" content="A React Boilerplate application" />
      </Helmet>
      <GlobalRoot />     // the Container which renders NULL for Global Injection
      <Switch>
          {/**Routes for Different Containers....*/}
      </Switch>
    </>
  );
}

Hi,
Thank you for creating this awesome project. I just cloned this to use for one of my company's big projects. However, I have met an annoying bug when I yarn start. The details will be described below.

Description

After cleaning example app and yarn start, the windows showed up error:

Windows cannot find 'false', please make sure you typed the name correctly, and then try again.

Steps to reproduce

1, Install project
2, Cleaning example app
3, yarn start

Expected behavior
In .env.local file, replace BROWSER=false with BROWSER=none will fix the problem.

Screenshots

Versions

• react-boilerplate-cra-template: 0.1.0 .
• Node/NPM/Yarn: v12.16.1 / v6.14.2 / v1.22.0 .
• Browser: Chrome v81.0.4044.122 (64bit).

How can I with this amazing boilerplate, use a authentification persist way my token?

Maybe add a feature like redux-persist ?

In my case, I need to persist my token in order to have a authentication system, routing persistence, maybe I'm not aware of a other way with the actual stack, but when i search "persist" in your documentation, I think no

Please let me know if you have any recommendation about this.

Is your feature request related to a problem? Please describe.
Add package redux-saga-routines

Describe the solution you'd like
I'm using redux-saga-routines and realize that it's a good choice to create action-creator. So I also wanna you can to consider and apply to this project.

After creating a new application with a cra-template-RB template and starting the app everything works fine. Though now when I am trying to add video.js with videojs-wavesurfer plugin, I am getting the following error.

I am following below configuration which has been provided by the plugin.

https://collab-project.github.io/videojs-wavesurfer/#/react

Though I have tried the above configuration with create-react-app and it's working perfectly fine, so it seems to be an issue with the boilerplate.

Here is the repo, https://github.com/dhavalsoni2001/videojs-react-boilerplate-cra-template to reproduce the issue.

Description

CRA docs say to pass --coverage flag via:
npm test -- --coverage

But this results in failing test due to render issue that aren't reported with just npm test

This is awesome, by the way!

Steps to reproduce

Steps to reproduce the behavior:

npx create-react-app --template cra-template-rb my-app
cd my-app
npm test -- --coverage

Expected behavior
Tests pass and coverage is reported

Screenshots

Versions

• react-boilerplate-cra-template: 1.0.0
• Node/NPM: 6.14.4
• Browser: n/a

Description

I started a custom-ui-library implemetation using the create-react-library using styled-components

I am facing the Error: Invalid hook call. errors when I am trying to integrate custom-ui-library to the react-boilerplate project.

I got the same error warnings with create-react-styled-library.

I've already opened an issue on the create-react-library and create-react-styled-library repo.
See
issue 302
issue 4

Any suggestions are welcomed.

Steps to reproduce

Install & Start
Create React App with the template

npx create-react-app --template cra-template-rb my-app

Start and check our example app, if you want

cd my-app
npm start

Remove the example app to start your project!

npm run cleanAndSetup

Create UI library project

npx create-react-styled-library

Add this dependency in Package.json

 "custom-ui-library": "file:../custom-ui-library",

Make following changes in src\app\containers\HomePage\index.tsx

import React from 'react';
import { Helmet } from 'react-helmet-async';
import { ThemeProvider, Button } from 'custom-ui-library';

export function HomePage() {
  return (
    <>
      <Helmet>
        <title>Home Page</title>
        <meta name="description" content="A Boilerplate application homepage" />
      </Helmet>
      <span>
        HomePage container
        <ThemeProvider>
          <Button variant="primary">Sample</Button>
        </ThemeProvider>
      </span>
    </>
  );
}

Expected behavior

The application should run without hook errors.
Using the styled-components in the consumer and in the library project should not conflict with each other.

Screenshots

Versions

• react-boilerplate-cra-template: v1.0.1
• Node/NPM: v12.14.1
• Browser: Google Chrome Version 86.0.4240.111 (Official Build) (64-bit)

To the template developers: how heavy are you on Redux state?

From what I see, Github API is handled via saga+redux, rather than via local asynchrony and local state, even though it definitely could be handled by the latter. Not sure if it's just for presentational purposes, or you're suggesting to use Redux for (almost?) everything.

I feel that, with the vast majority of Redux boilerplate gone due to Redux Toolkit, it indeed could be beneficial to fully shift to Redux and utilize its features (since storing half the state there and half there disables time-travel debugging), but I'd really would like to ask your opinion.

Thank you.

Before opening a new issue, please take a moment to review our community guidelines to make the contribution process easy and effective for everyone involved.

Description

Meta tags are not fetched by server-side rendering

Steps to reproduce

1. Open https://metatags.io/
2. Enter URL[(https://react-boilerplate.github.io/react-boilerplate-cra-template/)]

Expected behavior

Tag should be Home page - React App
A clear and concise description of what you expected to happen.

Screenshots
If applicable, add screenshots to help explain your problem.

Versions

• react-boilerplate-cra-template:
• Node/NPM:
• Browser:

Hello,

First of all, thank you for the fantastic CRA template.

The new CRA template is released with stable 1.0.0 version with all goodies of CRA. I have already existing application created from https://github.com/react-boilerplate/react-boilerplate, version 4.0.0.

Is there any guidelines to migrate from react-boilerplate to react-boilerplate-cra-template?

State is lost when any source files are edited.

None of translation, nor styled-component, nor component tsx files can be edited without losing state.

I'm not sure if component files are meant to be reloaded without losing state as well, nevertheless it's quite clearly written that, for example, translation files indeed are, however editing them after a fresh yarn create... does reset state.

What am I missing?

Thank you.

Hello,

First of all, thank you for the fantastic CRA template.

I believe RxJS has some advantages over Saga for large scale application. Support to have RxJs as an alternative to saga, will helps in developing enterprise grade application.

Thanks in advance.

Since you're already providing things such as recommended VSCode extensions, I think it'd be a great idea to add a set of recommended browser extensions as well, such as React Devtools, Redux Devtools and whatever else is out there.

Hi, love the new repo, thank you for all the hard work -

I was wondering where we should attach our global state (stuff for like auth, the logged in user profile, user settings etc) in the current paradigm

Could you provide an example?

Also, I noticed the change from createStructuredSelector to useSelector - was this intentional, if so, could you explain?

I love the cleaner redux + actions setup

Before opening a new issue, please take a moment to review our community guidelines to make the contribution process easy and effective for everyone involved.

Description

Tried running command
npx create-react-app --template cra-template-rb project-name
and got error in setup (pasted screenshot), situated in node_modules\react-scripts\scripts\utils\verifyTypeScriptSetup.js:231

Steps to reproduce

Steps to reproduce the behavior:

(Add link to a demo on https://jsfiddle.net or similar if possible)

Expected behavior
It should be able to generate the project

Screenshots
If applicable, add screenshots to help explain your problem.

Versions

• react-boilerplate-cra-template: 1.0.1
• Node/NPM: 6.14.6
• Browser: not_applicable