npm - generator-reackt - Versions diffs - 0.3.2 → 0.5.0 - Mend

generator-reackt 0.3.2 → 0.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (44) hide show

package/.prettierrc +4 -4
package/.stylelintrc +104 -0
package/LICENSE +9 -7
package/README.md +18 -18
package/generators/app/index.js +1 -307
package/generators/component/index.js +1 -56
package/generators/es.regexp.flags-ccfbed60.js +1 -0
package/generators/module/index.js +1 -117
package/generators/util/fs.js +1 -31
package/package.json +33 -29
package/templates/app/.babelrc +9 -9
package/templates/app/.browserslistrc +3 -3
package/templates/app/.editorconfig +11 -11
package/templates/app/.esdoc.json +23 -23
package/templates/app/.eslintrc.js +5 -13
package/templates/app/.lintstagedrc +4 -4
package/templates/app/.prettierrc +4 -4
package/templates/app/.storybook/addons.js +1 -1
package/templates/app/.storybook/config.js +14 -14
package/templates/app/.storybook/webpack.config.babel.js +7 -7
package/templates/app/.stylelintrc +271 -277
package/templates/app/gitignore +2 -0
package/templates/app/jest.config.js +15 -15
package/templates/app/jsconfig.json +8 -8
package/templates/app/package.json +18 -18
package/templates/app/src/components/App.js +14 -0
package/templates/app/src/icons.js +3 -3
package/templates/app/src/index.html +10 -10
package/templates/app/src/index.js +50 -54
package/templates/app/src/index.scss +16 -17
package/templates/app/src/reducers/application.js +21 -21
package/templates/app/src/reducers/index.js +7 -7
package/templates/app/src/sagas/application.js +9 -9
package/templates/app/src/sagas/index.js +7 -7
package/templates/app/src/selectors/application.js +1 -1
package/templates/app/src/selectors/application.test.js +13 -13
package/templates/app/src/utils/index.js +36 -32
package/templates/app/webpack.config.babel.js +103 -109
package/templates/component/index.js +19 -19
package/templates/component/index.test.js +14 -14
package/templates/module/reducer/index.js +20 -20
package/templates/module/saga/index.js +9 -9
package/CHANGELOG.md +0 -227
package/templates/app/src/components/App/App.js +0 -19

package/templates/app/package.json CHANGED Viewed

@@ -1,19 +1,19 @@
-{
-  "name": "<%= package.name %>",
-  "version": "<%= package.version %>",
-  "description": "<%= package.description %>",
-  "author": "<%= author.name %> <<%= author.email %>>",
-  "license": "<%= package.license %>",
-  "scripts": {
-    <% if (flags.addStorybook) { %>
-    "storybook": "start-storybook",
-    <% } %>
-    <% if (flags.addJest) { %>
-    "test": "jest",
-    <% } %>
-    "build": "cross-env NODE_ENV=production webpack",
-    "start": "cross-env NODE_ENV=development webpack serve"
-  },
-  "dependencies": {},
-  "devDependencies": {}
+{
+  "name": "<%= package.name %>",
+  "version": "<%= package.version %>",
+  "description": "<%= package.description %>",
+  "author": "<%= author.name %> <<%= author.email %>>",
+  "license": "<%= package.license %>",
+  "scripts": {
+    <% if (flags.addStorybook) { %>
+    "storybook": "start-storybook",
+    <% } %>
+    <% if (flags.addJest) { %>
+    "test": "jest",
+    <% } %>
+    "build": "cross-env NODE_ENV=production webpack",
+    "start": "cross-env NODE_ENV=development webpack serve"
+  },
+  "dependencies": {},
+  "devDependencies": {}
 }

package/templates/app/src/components/App.js ADDED Viewed

@@ -0,0 +1,14 @@
+<% if (flags.addRedux) { %>
+import { connect } from 'react-redux';
+<% } %>
+export default function App() {
+  return <h1>Hello World</h1>;
+}
+<% if (flags.addRedux) { %>
+export default connect(
+  null,
+  null
+)(App);
+<% } %>

package/templates/app/src/icons.js CHANGED Viewed

@@ -1,4 +1,4 @@
-import { library } from '@fortawesome/fontawesome-svg-core';
-import { faCircle } from '@fortawesome/free-solid-svg-icons';
+import { library } from '@fortawesome/fontawesome-svg-core';
+import { faCircle } from '@fortawesome/free-solid-svg-icons';
 library.add(faCircle);

package/templates/app/src/index.html CHANGED Viewed

@@ -1,10 +1,10 @@
-<!DOCTYPE html>
-<html>
-  <head>
-    <meta charset="utf-8" />
-    <meta name="viewport" content="width=device-width" />
-  </head>
-  <body>
-    <div id="root"></div>
-  </body>
-</html>
+<!DOCTYPE html>
+<html>
+  <head>
+    <meta charset="utf-8" />
+    <meta name="viewport" content="width=device-width" />
+  </head>
+  <body>
+    <div id="root"></div>
+  </body>
+</html>

package/templates/app/src/index.js CHANGED Viewed

@@ -1,54 +1,50 @@
-import 'core-js/stable';
-import 'regenerator-runtime/runtime';
-import React from 'react';
-import ReactDOM from 'react-dom';
-import { BrowserRouter as Router } from 'react-router-dom';
-<% if (flags.addRedux) { %>
-import { Provider } from 'react-redux';
-import createSagaMiddleware from 'redux-saga';
-import { applyMiddleware, createStore, compose } from 'redux';
-<% } %>
-<% if (flags.addFontAwesome) { %>
-  import './icons.js';
-<% } %>
-import './index.scss';
-import App from './components/App/App';
-<% if (flags.addRedux) { %>
-import rootSaga from './sagas';
-import rootReducer from './reducers';
-/* eslint-disable no-underscore-dangle */
-const composer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
-/* eslint-enable */
-const sagaMiddleware = createSagaMiddleware();
-const enhancers = composer(applyMiddleware(sagaMiddleware));
-export const store = createStore(rootReducer, {}, enhancers);
-if (module.hot) {
-  module.hot.accept('./reducers', () => {
-    store.replaceReducer(require('./reducers').default);
-  });
-}
-sagaMiddleware.run(rootSaga);
-<% } %>
-ReactDOM.render(
-  <Router>
-<% if (flags.addRedux) { %>
-    <Provider store={store}>
-      <App />
-    </Provider>
-<% } else { %>
-    <App />
-<% } %>
-  </Router>,
-  document.getElementById('root')
-);
-export default App;
+import 'core-js/stable';
+import 'regenerator-runtime/runtime';
+import ReactDOM from 'react-dom';
+import { BrowserRouter as Router } from 'react-router-dom';
+<% if (flags.addRedux) { %>
+import { Provider } from 'react-redux';
+import createSagaMiddleware from 'redux-saga';
+import { applyMiddleware, createStore, compose } from 'redux';
+<% } %>
+<% if (flags.addFontAwesome) { %>
+  import './icons.js';
+<% } %>
+import './index.scss';
+import App from './components/App';
+<% if (flags.addRedux) { %>
+import rootSaga from './sagas';
+import rootReducer from './reducers';
+/* eslint-disable no-underscore-dangle */
+const composer = window.__REDUX_DEVTOOLS_EXTENSION_COMPOSE__ || compose;
+/* eslint-enable */
+const sagaMiddleware = createSagaMiddleware();
+const enhancers = composer(applyMiddleware(sagaMiddleware));
+export const store = createStore(rootReducer, {}, enhancers);
+if (module.hot) {
+  module.hot.accept('./reducers', () => {
+    store.replaceReducer(require('./reducers').default);
+  });
+}
+sagaMiddleware.run(rootSaga);
+<% } %>
+ReactDOM.render(
+  <Router>
+<% if (flags.addRedux) { %>
+    <Provider store={store}>
+      <App />
+    </Provider>
+<% } else { %>
+    <App />
+<% } %>
+  </Router>,
+  document.getElementById('root')
+);

package/templates/app/src/index.scss CHANGED Viewed

@@ -1,17 +1,16 @@
-<% if (styleFramework === 'bulma') { %>
-@charset "utf-8";
-<% } %>
-@import "~normalize-scss/sass/normalize/import-now";
-<% if (styleFramework === 'bootstrap') { %>
-@import "~bootstrap/scss/bootstrap";
-<% } else if (styleFramework === 'uikit') { %>
-@import "~uikit/src/scss/variables-theme";
-@import "~uikit/src/scss/mixins-theme";
-@import "~uikit/src/scss/uikit-theme";
-<% } else if (styleFramework === 'foundation') { %>
-@import "~foundation-sites/scss/foundation";
-<% } else if (styleFramework === 'materialize') { %>
-@import "~materialize-css/sass/materialize";
-<% } else if (styleFramework === 'bulma') { %>
-@import "~bulma/bulma";
-<% } %>
+<% if (styleFramework === 'bulma') { %>
+@charset "utf-8";
+<% } %>
+<% if (styleFramework === 'bootstrap') { %>
+@import "~bootstrap/scss/bootstrap";
+<% } else if (styleFramework === 'uikit') { %>
+@import "~uikit/src/scss/variables-theme";
+@import "~uikit/src/scss/mixins-theme";
+@import "~uikit/src/scss/uikit-theme";
+<% } else if (styleFramework === 'foundation') { %>
+@import "~foundation-sites/scss/foundation";
+<% } else if (styleFramework === 'materialize') { %>
+@import "~materialize-css/sass/materialize";
+<% } else if (styleFramework === 'bulma') { %>
+@import "~bulma/bulma";
+<% } %>

package/templates/app/src/reducers/application.js CHANGED Viewed

@@ -1,21 +1,21 @@
-import { buildActions } from 'utils';
-export const types = buildActions('application', ['INIT_APP']);
-const initApp = () => ({
-  type: types.INIT_APP
-});
-export const actions = {
-  initApp
-};
-export const initialState = {};
-export const reducer = (state = initialState, action = {}) => {
-  switch (action.type) {
-    default:
-      return state;
-  }
-};
+import { buildActions } from 'utils';
+export const types = buildActions('application', ['INIT_APP']);
+const initApp = () => ({
+  type: types.INIT_APP
+});
+export const actions = {
+  initApp
+};
+export const initialState = {};
+export const reducer = (state = initialState, action = {}) => {
+  switch (action.type) {
+    default:
+      return state;
+  }
+};

package/templates/app/src/reducers/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { combineReducers } from 'redux';
-import { reducer as application } from './application';
-export default combineReducers({
-  application
-});
+import { combineReducers } from 'redux';
+import { reducer as application } from './application';
+export default combineReducers({
+  application
+});

package/templates/app/src/sagas/application.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { all } from 'redux-saga/effects';
-export const workers = {};
-export const watchers = {};
-export default function* saga() {
-  yield all(Object.values(watchers).map(watcher => watcher()));
-}
+import { all } from 'redux-saga/effects';
+export const workers = {};
+export const watchers = {};
+export default function* saga() {
+  yield all(Object.values(watchers).map(watcher => watcher()));
+}

package/templates/app/src/sagas/index.js CHANGED Viewed

@@ -1,7 +1,7 @@
-import { fork } from 'redux-saga/effects';
-import application from './application';
-export default function* saga() {
-  yield fork(application);
-}
+import { fork } from 'redux-saga/effects';
+import application from './application';
+export default function* saga() {
+  yield fork(application);
+}

package/templates/app/src/selectors/application.js CHANGED Viewed

	@@ -1 +1 @@
1	- export const getApplication = state => state.application;
1	+ export const getApplication = state => state.application;

package/templates/app/src/selectors/application.test.js CHANGED Viewed

@@ -1,13 +1,13 @@
-import { getApplication } from './application';
-describe('application selectors', () => {
-  const state = {
-    application: {
-      test: true
-    }
-  };
-  it('getApplication', () => {
-    expect(getApplication(state)).toBe(state.application);
-  });
-});
+import { getApplication } from './application';
+describe('application selectors', () => {
+  const state = {
+    application: {
+      test: true
+    }
+  };
+  it('getApplication', () => {
+    expect(getApplication(state)).toBe(state.application);
+  });
+});

package/templates/app/src/utils/index.js CHANGED Viewed

@@ -1,32 +1,36 @@
-import { createElement } from 'react';
-<% if (flags.addRedux) { %>
-/* eslint-disable react/display-name, react/prop-types */
-/**
- * Creates an object containing action constants namespaced under the specified reducer.
- *
- * @param {string} reducer The name of the reducer or module
- * @param {string[]} actions A list of action names
- * @return {object} Object with action name keys and full action string values
- */
-export function buildActions(reducer, actions) {
-  const result = {};
-  for (const action of actions) {
-    result[action] = `${reducer}/${action}`;
-  }
-  return result;
-}
-<% } %>
-/**
- * Creates a mock component which will expose its props for snapshot testing purposes.
- *
- * @param {string} name The component/element name (e.g. "MyComponent")
- * @param {object} props An object containing props to setup
- * @return {object} Mock component with specified name and props
- */
-export const mockComponent = (name, props = {}) => () =>
-  createElement(name, props, props.children);
+<% if (flags.addJest) { %>
+import { createElement } from 'react';
+<% } %>
+<% if (flags.addRedux) { %>
+/* eslint-disable react/display-name, react/prop-types */
+/**
+ * Creates an object containing action constants namespaced under the specified reducer.
+ *
+ * @param {string} reducer The name of the reducer or module
+ * @param {string[]} actions A list of action names
+ * @return {object} Object with action name keys and full action string values
+ */
+export function buildActions(reducer, actions) {
+  const result = {};
+  for (const action of actions) {
+    result[action] = `${reducer}/${action}`;
+  }
+  return result;
+}
+<% } %>
+<% if (flags.addJest) { %>
+/**
+ * Creates a mock component which will expose its props for snapshot testing purposes.
+ *
+ * @param {string} name The component/element name (e.g. "MyComponent")
+ * @param {object} props An object containing props to setup
+ * @return {object} Mock component with specified name and props
+ */
+export const mockComponent = (name, props = {}) => () =>
+  createElement(name, props, props.children);
+<% } %>

package/templates/app/webpack.config.babel.js CHANGED Viewed

@@ -1,109 +1,103 @@
-import webpack from 'webpack';
-import { resolve } from 'path';
-import HtmlPlugin from 'html-webpack-plugin';
-import ESLintPlugin from 'eslint-webpack-plugin';
-import TerserPlugin from 'terser-webpack-plugin';
-import StylelintPlugin from 'stylelint-webpack-plugin';
-import MiniCssExtractPlugin from 'mini-css-extract-plugin';
-import { CleanWebpackPlugin as CleanPlugin } from 'clean-webpack-plugin';
-import CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
-const dev = process.env.NODE_ENV === 'development';
-const plugins = [
-  new CleanPlugin(),
-  new StylelintPlugin({
-    configFile: '.stylelintrc',
-    context: 'src',
-    files: '**/*.scss',
-    failOnError: true,
-    quiet: false,
-    syntax: 'scss'
-  }),
-  new HtmlPlugin({
-    template: './src/index.html'
-  }),
-  new ESLintPlugin(),
-  new MiniCssExtractPlugin()
-];
-if (dev) {
-  plugins.push(new webpack.HotModuleReplacementPlugin());
-}
-export default {
-  mode: dev ? 'development' : 'production',
-  devtool: dev ? 'eval-cheap-module-source-map' : 'cheap-module-source-map',
-  entry: './src/index.js',
-  devServer: {
-    compress: dev,
-    open: true,
-    overlay: true,
-    historyApiFallback: true,
-    hot: dev,
-    port: 9000
-  },
-  module: {
-    rules: [
-      {
-        test: /\.js$/,
-        exclude: /node_modules/,
-        use: ['babel-loader']
-      },
-      {
-        test: /\.(sa|sc|c)ss$/,
-        use: [
-          MiniCssExtractPlugin.loader,
-          'css-loader',
-          {
-            loader: 'postcss-loader',
-            options: {
-              postcssOptions: {
-                ident: 'postcss',
-                plugins: [
-                  require('autoprefixer'),
-                  require('postcss-flexbugs-fixes')
-                ]
-              },
-              sourceMap: dev
-            }
-          },
-          'sass-loader'
-        ]
-      },
-      {
-        test: /\.html$/,
-        use: [
-          {
-            loader: 'html-loader',
-            options: { minimize: true }
-          }
-        ]
-      }
-    ]
-  },
-  output: {
-    path: resolve(__dirname, 'dist'),
-    filename: 'main.js',
-    chunkFilename: '[name].js'
-  },
-  plugins,
-  resolve: {
-    extensions: ['.js', '.json'],
-    modules: ['node_modules', 'src'],
-    alias: {
-      components: resolve(__dirname, 'src/components'),
-      utils: resolve(__dirname, 'src/utils')
-    }
-  },
-  optimization: {
-    minimizer: [
-      new TerserPlugin({
-        terserOptions: {
-          ecma: 9
-        }
-      }),
-      new CssMinimizerPlugin()
-    ]
-  }
-};
+import { resolve } from 'path';
+import HtmlPlugin from 'html-webpack-plugin';
+import ESLintPlugin from 'eslint-webpack-plugin';
+import TerserPlugin from 'terser-webpack-plugin';
+import StylelintPlugin from 'stylelint-webpack-plugin';
+import MiniCssExtractPlugin from 'mini-css-extract-plugin';
+import { CleanWebpackPlugin as CleanPlugin } from 'clean-webpack-plugin';
+import CssMinimizerPlugin from 'css-minimizer-webpack-plugin';
+const dev = process.env.NODE_ENV === 'development';
+const plugins = [
+  new CleanPlugin(),
+  new StylelintPlugin({
+    configFile: '.stylelintrc',
+    context: 'src',
+    files: '**/*.scss',
+    failOnError: true,
+    quiet: false,
+    customSyntax: 'postcss-scss'
+  }),
+  new HtmlPlugin({
+    template: './src/index.html'
+  }),
+  new ESLintPlugin(),
+  new MiniCssExtractPlugin()
+];
+export default {
+  mode: dev ? 'development' : 'production',
+  devtool: dev ? 'eval-cheap-module-source-map' : 'cheap-module-source-map',
+  entry: './src/index.js',
+  devServer: {
+    compress: dev,
+    open: true,
+    historyApiFallback: true,
+    hot: dev,
+    port: 9000
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        exclude: /node_modules/,
+        use: ['babel-loader']
+      },
+      {
+        test: /\.(sa|sc|c)ss$/,
+        use: [
+          MiniCssExtractPlugin.loader,
+          'css-loader',
+          {
+            loader: 'postcss-loader',
+            options: {
+              postcssOptions: {
+                ident: 'postcss',
+                plugins: [
+                  require('autoprefixer'),
+                  require('postcss-flexbugs-fixes')
+                ]
+              },
+              sourceMap: dev
+            }
+          },
+          'sass-loader'
+        ]
+      },
+      {
+        test: /\.html$/,
+        use: [
+          {
+            loader: 'html-loader',
+            options: { minimize: true }
+          }
+        ]
+      }
+    ]
+  },
+  output: {
+    path: resolve(__dirname, 'dist'),
+    filename: 'main.js',
+    chunkFilename: '[name].js'
+  },
+  plugins,
+  resolve: {
+    extensions: ['.js', '.json'],
+    modules: ['node_modules', 'src'],
+    alias: {
+      components: resolve(__dirname, 'src/components'),
+      utils: resolve(__dirname, 'src/utils')
+    }
+  },
+  optimization: {
+    minimizer: [
+      new TerserPlugin({
+        terserOptions: {
+          ecma: 12
+        }
+      }),
+      new CssMinimizerPlugin()
+    ]
+  }
+};