November: Procrastination Month

    babel-plugin-transform-assets-import-to-string

    1.2.0 • Public • Published

    babel-plugin-transform-assets-import-to-string

    Babel plugin that transforms image assets import and requires to urls / cdn

    npm Build Status

    Table of Contents

    About

    This babel plugin allows you to transform asset files into a string uri, allowing you to point your assets to CDN or other hosts, without needing to run your code through module bundlers.

    This helps when doing isomorphic / server-rendered applications.

    import image from '../path/assets/icon.svg';
    const image1 = require('../path/assets/icon1.svg');
     
    // to
     
    const image = 'http://your.cdn.address/assets/icon.svg';
    const image1 = 'http://your.cdn.address/assets/icon1.svg';
     
    // Somewhere further down in your code:
    //
    // eg: JSX
    // <img src={image} alt='' />
    //
    // eg: Other cases
    // ajaxAsyncRequest(image)

    See the spec for more examples.

    Installation

    $> npm install babel-plugin-transform-assets-import-to-string --save
    

    Usage

    via .babelrc

    {
      "plugins": [
        [
          "transform-assets-import-to-string",
          {
            "baseDir": "/assets",
            "baseUri": "http://your.cdn.address"
          }
        ]
      ]
    }

    via Node API

    require('babel-core').transform('code', {
      plugins: [
        [
          'transform-assets-import-to-string',
          {
            baseDir: '/assets',
            baseUri: 'http://your.cdn.address'
          }
        ]
      ]
    });

    By default, it will transform the following extensions: .gif, .jpeg, .jpg, .png, .svg if extensions option is not defined. To configure a custom list, just add the extensions array as an option.

    Note: leading . (dot) is required.

    {
      "plugins": [
        [
          "transform-assets-import-to-string",
          {
            "extensions": [".jpg", ".png"]
          }
        ]
      ]
    }

    License

    babel-plugin-transform-assets-import-to-string is MIT licensed

    Install

    npm i babel-plugin-transform-assets-import-to-string

    DownloadsWeekly Downloads

    2,399

    Version

    1.2.0

    License

    MIT

    Unpacked Size

    330 kB

    Total Files

    17

    Last publish

    Collaborators

    • geraldyeo