chore: maintain all dev dependencies and build process (#27)

Co-authored-by: Justin Schrader <[email protected]>

.eslintrc

@@ -2,15 +2,11 @@
   "extends": [
     "airbnb",
     "plugin:@typescript-eslint/eslint-recommended",
-    "plugin:@typescript-eslint/recommended",
-    "plugin:prettier/recommended",
-    "prettier/@typescript-eslint",
-    "prettier/react"
+    "plugin:@typescript-eslint/recommended"
   ],
   "parser": "@typescript-eslint/parser",
   "plugins": [
     "@typescript-eslint",
-    "prettier",
     "react-hooks"
   ],
   "env": {
@@ -30,4 +26,4 @@
   "globals": {
     "jest": "writable"
   }
-}
+}

.github/workflows/nodejs.yml

@@ -11,12 +11,11 @@ on:
 
 jobs:
   build:
-
     runs-on: ubuntu-latest
 
     strategy:
       matrix:
-        node-version: [14.15.3]
+        node-version: [15.14.0]
 
     steps:
     - uses: actions/checkout@v2

.gitignore

@@ -2,4 +2,11 @@
 /dist/*
 /yarn-error.log
 /coverage
+.yarn/*
+!.yarn/patches
+!.yarn/releases
+!.yarn/plugins
+!.yarn/sdks
+!.yarn/versions
+.pnp.*
 .DS_Store

.husky/.gitignore

@@ -0,0 +1 @@
+_

.husky/commit-msg

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn commitlint --edit $1

.husky/pre-commit

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn build && yarn lint && yarn test

.husky/pre-push

@@ -0,0 +1,4 @@
+#!/bin/sh
+. "$(dirname "$0")/_/husky.sh"
+
+yarn build && yarn types && yarn lint && yarn test-build

.npmignore

@@ -2,16 +2,23 @@
 .git/
 .github/
 .gitignore
+.gitignore
+.husky/
 .npmignore
 .nvmrc
-/yarn-error.log
+.yarn/
+.yarnrc.yml
+CONTRIBUTING.md
+MIGRATIONS.md
 babel.config.js
 commitlint.config.js
 coverage/
-coverage/
 hooks/
 jest.config.js
 jest.setup.js
 rollup.config.js
 scripts/
 src/
+tsconfig.json
+yarn-error.log
+yarn.lock

.nvmrc

@@ -1 +1 @@
-v14.15.3
+v15.14.0

.yarnrc.yml

@@ -0,0 +1,7 @@
+nodeLinker: node-modules
+
+plugins:
+  - path: .yarn/plugins/@yarnpkg/plugin-interactive-tools.cjs
+    spec: "@yarnpkg/plugin-interactive-tools"
+
+yarnPath: .yarn/releases/yarn-2.4.2.cjs

README.md

@@ -9,7 +9,7 @@
 </p>
 
 <p align="center">
-  A small (~1.6kb gzip), flexible, <a href="https://reactjs.org/docs/hooks-intro.html">hook</a> for rendering breadcrumbs with <a href="https://github.com/ReactTraining/react-router">react-router</a> (5.1 and up).
+  A small (~1.25kb gzip), flexible, <a href="https://reactjs.org/docs/hooks-intro.html">hook</a> for rendering breadcrumbs with <a href="https://github.com/ReactTraining/react-router">react-router</a> (5.1 and up).
 </p>
 
 <hr/>
@@ -22,7 +22,7 @@
 
 <p align="center">
   <code>
-    This package only works with `react-router` 5.1 and up. If you need a (very) similar solution for an earlier version, check out <a href="https://github.com/icd2k3/react-router-breadcrumbs-hoc">react-router-breadcrumbs-hoc</a>
+    If you'd rather use a Higher Order Component, check out <a href="https://github.com/icd2k3/react-router-breadcrumbs-hoc">react-router-breadcrumbs-hoc</a>
   </code>
 </p>
 

babel.config.js

@@ -7,6 +7,6 @@ module.exports = (api) => {
       '@babel/preset-react',
       '@babel/preset-typescript',
     ],
-    plugins: [],
+    plugins: ['@babel/plugin-transform-runtime'],
   };
 };

jest.setup.js

@@ -1,3 +1,4 @@
+import 'jsdom-global/register';
 import Enzyme from 'enzyme';
 import Adapter from '@wojtekmaj/enzyme-adapter-react-17';
 

package.json

@@ -1,75 +1,65 @@
 {
   "name": "use-react-router-breadcrumbs",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "A hook for displaying and setting breadcrumbs for react router",
   "main": "dist/cjs/index.js",
   "module": "dist/es/index.js",
   "umd": "dist/umd/index.js",
   "repository": "[email protected]:icd2k3/use-react-router-breadcrumbs.git",
   "author": "Justin Schrader <[email protected]>",
   "license": "MIT",
-  "private": false,
   "types": "dist/index.d.ts",
   "peerDependencies": {
     "react": ">=16.8",
     "react-router": ">=5.1.0"
   },
   "scripts": {
-    "prepublishOnly": "npm run build",
+    "prepublishOnly": "yarn build && pinst --disable",
     "build": "rollup -c",
     "test": "jest",
     "test-build": "sh ./scripts/test-build.sh",
     "types": "tsc -p tsconfig.json",
-    "lint": "eslint ./src/**"
-  },
-  "husky": {
-    "hooks": {
-      "commit-msg": "commitlint -E HUSKY_GIT_PARAMS",
-      "pre-commit": "yarn build && yarn lint && yarn test",
-      "pre-push": "yarn build && yarn types && yarn lint && yarn test-build"
-    }
+    "lint": "eslint ./src/**",
+    "postpublish": "pinst --enable",
+    "prepare": "husky install"
   },
   "devDependencies": {
-    "@babel/cli": "^7.8.4",
-    "@babel/core": "^7.8.7",
-    "@babel/preset-env": "^7.8.7",
-    "@babel/preset-react": "^7.8.3",
-    "@babel/preset-typescript": "^7.8.3",
-    "@commitlint/cli": "^11.0.0",
-    "@commitlint/config-conventional": "^11.0.0",
-    "@rollup/plugin-commonjs": "^17.0.0",
-    "@rollup/plugin-node-resolve": "^11.0.1",
-    "@types/react": "^17.0.0",
-    "@types/react-dom": "^17.0.0",
-    "@types/react-router": "^5.1.4",
-    "@typescript-eslint/eslint-plugin": "^4.10.0",
-    "@typescript-eslint/parser": "^4.10.0",
-    "@wojtekmaj/enzyme-adapter-react-17": "^0.4.1",
+    "@babel/cli": "^7.14.3",
+    "@babel/core": "^7.14.3",
+    "@babel/plugin-transform-runtime": "^7.14.3",
+    "@babel/preset-env": "^7.14.4",
+    "@babel/preset-react": "^7.13.13",
+    "@babel/preset-typescript": "^7.13.0",
+    "@commitlint/cli": "^12.1.4",
+    "@commitlint/config-conventional": "^12.1.4",
+    "@rollup/plugin-babel": "^5.3.0",
+    "@rollup/plugin-typescript": "^8.2.1",
+    "@types/react": "^17.0.11",
+    "@types/react-dom": "^17.0.7",
+    "@types/react-router": "^5.1.15",
+    "@typescript-eslint/eslint-plugin": "^4.26.1",
+    "@typescript-eslint/parser": "^4.26.1",
+    "@wojtekmaj/enzyme-adapter-react-17": "^0.6.1",
     "babel-eslint": "^10.1.0",
-    "babel-jest": "^26.6.3",
-    "coveralls": "^3.0.9",
     "enzyme": "^3.11.0",
-    "eslint": "^7.16.0",
-    "eslint-config-airbnb": "^18.1.0",
-    "eslint-config-prettier": "^7.1.0",
-    "eslint-plugin-import": "^2.20.1",
-    "eslint-plugin-jsx-a11y": "^6.2.3",
-    "eslint-plugin-prettier": "^3.1.3",
-    "eslint-plugin-react": "^7.19.0",
+    "eslint": "^7.28.0",
+    "eslint-config-airbnb": "^18.2.1",
+    "eslint-plugin-import": "^2.23.4",
+    "eslint-plugin-jsx-a11y": "^6.4.1",
+    "eslint-plugin-react": "^7.24.0",
     "eslint-plugin-react-hooks": "^4.2.0",
-    "husky": "^4.2.1",
-    "jest": "^26.6.3",
-    "js-yaml": "^3.13.1",
-    "prettier": "^2.0.5",
+    "husky": "^6.0.0",
+    "jest": "^27.0.4",
+    "jsdom-global": "^3.0.2",
+    "pinst": "^2.1.6",
     "prop-types": "^15.7.2",
-    "react": "^17.0.1",
-    "react-dom": "^17.0.1",
-    "react-router": "^5.1.2",
-    "rollup": "^2.1.0",
-    "rollup-plugin-babel": "^4.4.0",
+    "react": "^17.0.2",
+    "react-dom": "^17.0.2",
+    "react-router": "^5.2.0",
+    "rollup": "^2.51.1",
+    "rollup-plugin-size": "^0.2.2",
     "rollup-plugin-terser": "^7.0.2",
-    "rollup-plugin-typescript2": "^0.29.0",
-    "typescript": "^4.1.3"
+    "typescript": "^4.3.2"
   },
   "keywords": [
     "react",

rollup.config.js

@@ -1,65 +1,51 @@
-import babel from 'rollup-plugin-babel';
-import commonjs from '@rollup/plugin-commonjs';
-import resolve from '@rollup/plugin-node-resolve';
+import babel from '@rollup/plugin-babel';
+import typescript from '@rollup/plugin-typescript';
+import size from 'rollup-plugin-size';
 import { terser } from 'rollup-plugin-terser';
-import typescript from 'rollup-plugin-typescript2';
-import ts from 'typescript';
 
 import pkg from './package.json';
 
-const external = Object.keys(pkg.peerDependencies);
+const external = Object.keys(pkg.peerDependencies).concat(/@babel\/runtime/);
 
 const extensions = ['.js', '.tsx'];
 
-const plugins = [
-  typescript({
-    useTsconfigDeclarationDir: true,
-    tsconfigOverride: {
-      typescript: ts,
-      compilerOptions: {
-        module: 'es2015',
-      },
-    },
-  }),
+const sharedPlugins = [
+  typescript(),
   babel({
+    babelHelpers: 'runtime',
     exclude: 'node_modules/**',
     extensions,
   }),
-  resolve({
-    mainFields: ['module', 'main', 'umd'],
-    extensions,
-  }),
+  size(),
 ];
 
-const exports = [
-  {
-    format: 'cjs',
-    file: pkg.main,
-    plugins: plugins.concat([commonjs(), terser()]),
-  },
-  {
-    format: 'umd',
-    file: pkg.umd,
-    plugins: plugins.concat([commonjs(), terser()]),
-  },
-  { format: 'es', file: pkg.module, plugins },
+const formats = [
+  { format: 'umd', file: pkg.umd, plugins: sharedPlugins.concat([terser({ format: { comments: false } })]) },
+  { format: 'cjs', file: pkg.main, plugins: sharedPlugins },
+  { format: 'es', file: pkg.module, plugins: sharedPlugins },
 ];
 
 const globals = {
   react: 'React',
   'react-router': 'ReactRouter',
 };
 
-export default exports.map((item) => ({
+export default formats.map(({ plugins, file, format }) => ({
   input: 'src/index.tsx',
-  plugins: item.plugins,
+  plugins,
   external,
   output: {
     exports: 'named',
-    file: item.file,
-    format: item.format,
-    name: 'use-react-router-breadcrumbs',
-    globals,
-    sourcemap: true,
+    file,
+    format,
+    name: 'react-router-breadcrumbs-hoc',
+    globals: format !== 'umd'
+      ? globals
+      : {
+        ...globals,
+        '@babel/runtime/helpers/toConsumableArray': '_toConsumableArray',
+        '@babel/runtime/helpers/defineProperty': '_defineProperty',
+        '@babel/runtime/helpers/objectWithoutProperties': '_objectWithoutProperties',
+      },
   },
 }));

src/index.test.js

@@ -29,8 +29,8 @@ const components = {
     return (
       <h1>
         <div className="forwarded-props">
-          {forwardedProps &&
-            Object.values(forwardedProps)
+          {forwardedProps
+            && Object.values(forwardedProps)
               .filter((v) => typeof v === 'string')
               .map((value) => <span key={value}>{value}</span>)}
         </div>
@@ -104,7 +104,7 @@ const render = ({ options, pathname, routes, state, props }) => {
         routes={routes}
         {...(props || {})}
       />
-    </Router>
+    </Router>,
   );
 
   return {
@@ -135,7 +135,7 @@ components.Breadcrumbs.propTypes = {
         PropTypes.func,
         PropTypes.object,
       ]),
-    })
+    }),
   ),
 };
 
@@ -419,13 +419,11 @@ describe('use-react-router-breadcrumbs', () => {
 
   describe('Invalid route object', () => {
     it('Should error if `path` is not provided', () => {
-      expect(() =>
-        getMethod()({
-          routes: [{ breadcrumb: 'Yo' }],
-          location: { pathname: '/1' },
-        })
-      ).toThrow(
-        'useBreadcrumbs: `path` must be provided in every route object'
+      expect(() => getMethod()({
+        routes: [{ breadcrumb: 'Yo' }],
+        location: { pathname: '/1' },
+      })).toThrow(
+        'useBreadcrumbs: `path` must be provided in every route object',
       );
     });
   });