On my Phoenix project, I found a peculiar behavior of sass-brunch.
Here are the short descriptions of my problem:
- It generates a correct
app.csson thepriv/static/cssdirectory when the Phoenix server started in dev envrionment. - When I modify one of SCSS files, the
app.cssgets generated but lacks only the lines from the modified SCSS file. It keeps the lines from the unmodified files. - This problem occurs on Ubuntu 16.04, but not on macOS.
On the log file, I noticed an entry that may be related to this issue:
[debug] Duplicate channel join for topic "phoenix:live_reload" in Phoenix.LiveReloader.Socket. Closing existing channel for new join.
I don't see such a line on my Mac.
My environment:
- Ubuntu 16.04 Desktop
- Phoenix 1.2.5
- Node.js 8.9.1
- npm 5.5.1
- Brunch 2.10.7
- sass-brunch 2.10.4
My package.json:
{
"repository": {},
"license": "MIT",
"scripts": {
"deploy": "brunch build --production",
"watch": "brunch watch --stdin"
},
"dependencies": {
"phoenix": "file:deps/phoenix",
"phoenix_html": "file:deps/phoenix_html"
},
"devDependencies": {
"babel-brunch": "6.0.6",
"brunch": "2.10.7",
"clean-css-brunch": "2.10.0",
"sass-brunch": "^2.10.4",
"uglify-js-brunch": "2.1.1"
}
}
[UPDATE]
I found an interesting fact.
- When I edit SCSS files using vim, the
app.cssgets generated normally. - When I edit them using atom, things do not go well.
I found a workaround to my problem.
Put these lines to the
brunch-config.js:watcher: { usePolling: true }As the documentation of Brunch says, watcher gets slower but can be more reliable by setting
trueto this option.The
usePollingoption is passed to chokidar, whose document says: