esnext-scripts

Opinionated ESNext application scripts and configurations.

Install

npm install esnext-scripts

or yarn

yarn add esnext-scripts

What?

esnext-scripts is set of pre-configured helpers for your next generation Javascript application. With it, you can now fully focus on your valuable implementations instead of playing around with various settings & helpers over and over again. Batteries included:

• Latest EMACScript supports backed by:
  • ESM
  • babel-preset-env
  • babel-preset-stage-1
  • babel-preset-react
• A mostly reasonable approach to JavaScript by:
  • ESLint
  • StandardJS Style Guide
  • Prettier
• Delightful JavaScript Testing with
  • Jest
  • Enzyme

Why?

How much time you had spent on configuring your application boilerplate to make it support the "future" JavaScript spec. each time you start a new project?

How many times you had been confused by the obsolete babel settings (plugins, presets) or even worse, your applications got broken?

How?

Available commands

• esnext build <src> <out> - compile an input directory of modules into an output directory.
• esnext exec <script> [--watch] [--env] - execute a Node.js script with ESNext supports.
• esnext format <glob> - format files find by the given glob pattern via prettier.
• esnext lint [optional-folder] - start linting with standardjs rules set.
• esnext test - start executing your Jest test specs, custom settings supported via (by order):
  • <cwd>/jest.config.js
  • <cwd>/package.json#jest

Available config

• eslint

Sample Usage

1. .eslintrc.js

const config = require('esnext-scripts')

module.exports = config.eslint

1. A sample structure of React application folder.

- src/
    App.jsx
    App.test.jsx

App.test.jsx.

import React from 'react'
import { shallow } from 'enzyme'
import App from './App'
 
describe('<App />', () => {
  it('renders <App /> component', () => {
    const wrapper = shallow(<App>Application</App>)
    expect(wrapper).toBeTruthy()
  })
}

package.json.

  "lint-staged": {
    "**/*.{js,jsx}": [
      "esnext format 'src/**/*.js",
      "esnext lint --fix"
    ]
  },
  "husky": {
    "hooks": {
      "pre-commit": "lint-staged",
      "commit-msg": "commitlint --env HUSKY_GIT_PARAMS"
    }
  },
  "scripts": {
    "lint": "esnext lint",
    "lint:other-folder": "esnext lint other-folder",
    "start": "yo-env",
    "start:development": "esnext exec --watch src/index.js",
    "start:production": "esnext exec --env ../.env src/index.js",
    "test": "esnext test"
  },

License

MIT License 2019 © Jim Zhan