sprockets-loader

0.5.1 • Public • Published

sprockets-loader Build Status Version Status

A JavaScript, Webpack-enabled Rails Sprockets port.

Bring Sprockets into JavaScript's realm. Features include:

  • Parses Sprockets directives, require, require_tree and require_directory.
  • Uses the same logical path file location resolution as Rails Sprockets.
  • Reads your Gemfile.lock, enabling Gem usage, like jquery-ujs.

Installation

$ npm install sprockets-loader --save-dev

Usage

// Your webpack configuration
module.exports = {
  entry: {
    'application.js': './examples/application.js'
  },
  output: {
    path: 'public/assets',
    filename: '[name]'
  },
  module: {
    preLoaders: [
      {
        loader: 'sprockets-loader',
        query: {
          logicalPaths: [
            'examples'
          ]
        }
      }
    ]
  }
};

Tests

You can run tests with: npm test or npm run watch.

Stylesheets?

While sprockets-loader can handle stylesheets, it is suggested that you do not use it for them.

Everything in Webpack requires that the second and subsequent steps of the loader process produce JavaScript source. SASS, LESS, and CSS can be parsed in the first step, but are output with stylesheet Webpack loaders. That means, during development, you'll have to include your stylesheets as JavaScript – Highly weird, if you ask me.

If you insist on trying it, here's a small idea of how that would work:

// Your webpack configuration
module.exports = {
  entry: {
    'application.css.js': './examples/application.css'
  },
  // ...
};
<html>
  <head>
    <script type="text/javascript" src="application.css.js"></script> 
  </head>
  <!-- ... -->
</html>

Extension

This repository uses the term compat to mean a base file type, such as .js. These compats can be found here. There are three components to create a complete compat:

  • extensions: Other file types that are compatible with the base file type.
  • loaders: Order-dependent loaders that are needed to interpret the base file compat, if encountered.
  • terminal: What the final file type should be, which can and in most cases will be different from the base file type.

/sprockets-loader/

    Package Sidebar

    Install

    npm i sprockets-loader

    Weekly Downloads

    2

    Version

    0.5.1

    License

    MIT

    Last publish

    Collaborators

    • treycordova