Quick Start Guide
This guide will walk you through the basics of using Propshaft in a new Rails application.
1. Create a New Rails App
Start by creating a new Rails 7+ application, specifying propshaft as the asset pipeline.
rails new propshaft_demo -a propshaft
cd propshaft_demo2. Create an Asset
Let's create a simple CSS file to style our application. Propshaft looks for assets in app/assets by default.
Create a new file app/assets/stylesheets/application.css:
/* app/assets/stylesheets/application.css */
body {
background-color: #f0f0f0;
font-family: sans-serif;
text-align: center;
}
h1 {
color: #333;
}3. Include the Asset in Your View
Propshaft integrates with Rails' standard view helpers. Open the main layout file app/views/layouts/application.html.erb and use the stylesheet_link_tag to include your new stylesheet.
<!DOCTYPE html>
<html>
<head>
<title>PropshaftDemo</title>
<meta name="viewport" content="width=device-width,initial-scale=1">
<%= csrf_meta_tags %>
<%= csp_meta_tag %>
<%= stylesheet_link_tag "application" %>
</head>
<body>
<h1>Welcome to Propshaft!</h1>
<%= yield %>
</body>
</html>4. Start the Development Server
In development, Propshaft serves assets dynamically. Start the Rails server:
./bin/devNavigate to http://localhost:3000. You should see your welcome message with the styles from application.css applied.
If you inspect the page source, you'll see a link to the stylesheet:
<link rel="stylesheet" href="/assets/application-d368d998.css" />Even in development, Propshaft uses a digest for caching purposes, but it serves the file directly from the source without needing a precompilation step.
5. Precompiling for Production
In a production environment, you'll want to precompile your assets. This process copies all assets to public/assets, stamps them with a digest, and creates a .manifest.json file for mapping.
Run the precompile task:
rails assets:precompileThis will generate the production-ready assets in public/assets. When you run your application in the production environment, Rails will use these static, digested files, which is ideal for performance and caching.
That's it! You've successfully set up and used Propshaft to manage and serve a basic asset.