Enable Sass/scss in Phoenix

Step 1: Add brunch

1
cd assets && yarn add sass-brunch

Step 2: Add plugin in brunch-config.js

1
2
3
4
5
6
// brunch-config.js
plugins: {
sass: {
mode: 'native',
},
}

Step3: Enable hot-reload

1
2
3
4
5
6
7
8
9
10
11
// dev.exs
// add sass and scss to the pattern
config :citaDappStore, CitaDappStoreWeb.Endpoint,
live_reload: [
patterns: [
~r{priv/static/.*(js|css|png|jpeg|jpg|gif|svg|sass|scss)$},
~r{priv/gettext/.*(po)$},
~r{lib/citaDappStore_web/views/.*(ex)$},
~r{lib/citaDappStore_web/templates/.*(eex)$}
]
]

That’s all.

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×