usabilityhubrails-erb-loader
Embedded Ruby (
.erb) webpack loader for Ruby projects.
Compiles Embedded Ruby template files in any Ruby project. Files are built using either the Erubis or ERB gem.
Table of Contents
Install
npm
$ npm install rails-erb-loader --save-devyarn
$ yarn add -D rails-erb-loaderUsage
Add rails-erb-loader to your rules.
// webpack.config.js
module.exports = {
module: {
rules: [
{
test: /\.erb$/,
enforce: 'pre',
loader: 'rails-erb-loader'
},
]
}
}
};Now you can use .erb files in your project, for example:
app/assets/javascripts/UserFormFields.jsx.erb
/* rails-erb-loader-dependencies models/user models/image */
export default function UserFormFields() {
return (
<div>
<label htmlFor='avatar'>
Avatar
</label>
<ImageField id='avatar' maxSize={<%= Image::MAX_SIZE %>} />
<label htmlFor='name'>
Name
</label>
<input
id='name'
type='text'
maxLength={<%= User::MAX_NAME_LENGTH %>}
/>
<label htmlFor='age'>
Age
</label>
<input
id='age'
type='number'
min={<%= User::MIN_AGE %>}
max={<%= User::MAX_AGE %>}
/>
</div>
)
}Configuration
Options
Can be configured with UseEntry#options.
| Option | Default | Description |
|---|---|---|
dependenciesRoot |
"app" |
The root of your Rails project, relative to webpack's working directory. |
engine |
"erb" |
ERB Template engine, "erubi", "erubis" and "erb" are supported. |
runner |
"./bin/rails runner" |
Command to run Ruby scripts, relative to webpack's working directory. |
timeoutMs |
0 |
Timeout for the runner task in milliseconds. 0 is no timeout. Set this if you want a hanging runner to error out the build. |
env |
process.env |
Environment variables to be passed to runner. |
For example, if your webpack process is running in a subdirectory of your Rails project:
{
loader: 'rails-erb-loader',
options: {
runner: '../bin/rails runner',
dependenciesRoot: '../app',
}
}Also supports building without Rails:
{
loader: 'rails-erb-loader',
options: {
runner: 'ruby',
engine: 'erb'
}
}Dependencies
If your .erb files depend on files in your Ruby project, you can list them explicitly. Inclusion of the rails-erb-loader-dependency (or -dependencies) comment will tell webpack to watch these files - causing webpack-dev-server to rebuild when they are changed.
Watch individual files
List dependencies in the comment. .rb extension is optional.
/* rails-erb-loader-dependencies models/account models/user */Watch a whole directory
To watch all files in a directory, end the path in a /.
/* rails-erb-loader-dependencies ../config/locales/ */Contribute
Questions, bug reports and pull requests welcome. See GitHub issues.
License
MIT