Giter VIP home page Giter VIP logo

neat-preset's Introduction

neat-presets

My highly opinionated batteries included plugin-bundles

  • Babel presets for next @neat-preset/babel/next and node @neat-preset/babel/node
  • Production ready next configuration at @neat-preset/next which is including, next-images and next-fonts
  • Adds dotenv loading behaviour similar to create-react-app
  • Adds global dev-expression (compiling __DEV__ to true or false based on your NODE_ENV on build-time)
  • Includes my favorite babel plugins like babel-plugin-macros and export-syntax extensions See list below

Usage

yarn add @neat-preset/next yarn add --dev @neat-preset/next-dev @neat-preset/babel

Babel for Nextjs Clients

{
  "presets": [
    ["@neat-preset/babel/next", {
      "preset-env": {},
      "transform-runtime": {},
      "module-resolver": {},
      "styled-jsx": {},
      "class-properties": {}
      "styled-components": {}
    }]
  ],
  "plugins": []
}

Babel for Node

{
  "presets": [
    ["@neat-preset/babel/node", {
      "preset-env": {},
      "transform-runtime": {},
      "module-resolver": {},
      "class-properties": {}
    }]
  ],
  "plugins": []
}

next.config.js

With images from a different host and inlined images by size limit:

module.exports = require('@neat-preset/next-dev')({
    images: {
        assetPrefix: 'https://images.example.com',
        inlineImageLimit: 16384, // default is 8192
    },
})({
    target: 'serverless',
})

With fonts from a different remote or include SVG fonts:

module.exports = require('@neat-preset/next-dev')({
    fonts: {
        assetPrefix: 'https://fonts.example.com',
        enableSvg: true,
    },
})({
    target: 'serverless',
})

List node_modules/ that should be transpiled before being included by webpack

module.exports = require('@neat-preset/next-dev')({
    transpileModules: ['somemodule', 'and-another'],
})({
    target: 'serverless',
})

License

Licensed under the MIT License, Copyright © 2019-present Richard Keil

See LICENSE for more information.

Acknowledgements

This project is standing on the shoulders of giants as it is build on top of earlier open-source work by clever folks all around the world.

Please check them out:

Included Libraries

neat-preset's People

Contributors

dependabot[bot] avatar igl avatar

Stargazers

 avatar  avatar  avatar

Watchers

 avatar

neat-preset's Issues

Richi!

so, nextjs vs gatsbyjs? :)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.