Git Product home page Git Product logo

rollup-plugin-globlin's Introduction


rollup-plugin-globlin

A rollup plugin that provides file watching, copy, transform, repath and rename capabilities.

Why?

The vast majority of rollup plugins which provide file transforms and/or copies were a bunch of smoke and mirrors and kept falling short for what I required.

Install

pnpm i rollup-plugin-globlin --save-dev

Usage

import globs from "rollup-plugin-globlin";

export default {
  input: "src/index.js",
  output: {
    dir: "output",
    format: "cjs",
  },
  plugins: [
    globs({
      globs: ["dir/**/*.json", "assets/*.svg"],
      dest: "dest",
      clean: true,
      transform: object | function,
    }),
  ],
};

Transforms

The plugin transform option will allow you to rename, repath and/or modify contents of a file. The transform option accepts either an object or function which will supply an object parameter argument. Transforms must return either a string or object value. When an transform returns a string it is interpreted as a combination rename and repath, see below example:

Transforming multiple files

globs({
  globs: ["dir/**/*.json", "assets/*.svg"],
  dest: "dest",
  transform: {
    "img/**/file.png": "rename.png" // string without slash will rename the file
    "image.jpg": "images/prepend-[name].[ext]" // string with slash / will repath from dest/
    "data/*.json": ({ content }) => {

      // Returning a function on all '.json' files and do some modifications
      // For example, lets beautify these JSON files with an indentation of 4
      const json = JSON.stringify(JSON.parse(content), null, 4)

      // Returning an object using you can repath and rename the files using the
      return {
        content: json, // the transformed contents, should always be a string!
        file: `new-[name].json`, // prepend `new-` to these all filenames
        dest: 'json/dest' // output files to a new destination relative to workspace root
      }
    },
  },
}),

Transforming all files

import { minify } from 'html-minifier'

globs({
  globs: ["views/*.html"],
  dest: "pages",
  transform: ({ content }) => {

      // This will modify all files referenced in globs
      // for example, let minify all HTML files
      const html =  minify(content.toString());

      return {
        content: html, // the transformed contents, should always be a string!
        file: `[name].liquid`, // all files should use a `.liquid` extension
      }
    },
  },
}),

License

This package licensed under MIT.

Related

Author

🥛 Νίκος Σαβίδης

rollup-plugin-globlin's People

Contributors

panoply avatar

Stargazers

 avatar

Watchers

 avatar  avatar

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.