Skip to content

Commit

Permalink
Add support for disabling style-loader via inline_css: false. This wi…
Browse files Browse the repository at this point in the history
…ll cause only mini-css-extract-plugin to be used. See shakacode#68
  • Loading branch information
cheald committed Feb 21, 2022
1 parent 2b70a6f commit 5c7eb2d
Show file tree
Hide file tree
Showing 5 changed files with 29 additions and 3 deletions.
4 changes: 3 additions & 1 deletion README.md
Expand Up @@ -670,7 +670,9 @@ development:
port: 3035
```

If you have `hmr` turned to true, then the `stylesheet_pack_tag` generates no output, as you will want to configure your styles to be inlined in your JavaScript for hot reloading. During production and testing, the `stylesheet_pack_tag` will create the appropriate HTML tags.
If you have `hmr` turned to true and `inline_styles` is not false, then the `stylesheet_pack_tag` generates no output, as you will want to configure your styles to be inlined in your JavaScript for hot reloading. During production and testing, the `stylesheet_pack_tag` will create the appropriate HTML tags.

If you want to have HMR and separate link tags, set `hmr: true` and `inline_styles: false`. This will cause styles to be extracted and reloaded with the `mini-css-extract-plugin` loader. Note that in this scenario, you do not need to include style-loader in your project dependencies.

### Additional paths

Expand Down
9 changes: 9 additions & 0 deletions lib/webpacker/dev_server.rb
Expand Up @@ -55,6 +55,15 @@ def hmr?
fetch(:hmr)
end

def inline_css?
case fetch(:inline_css)
when false, "false"
false
else
true
end
end

def env_prefix
config.dev_server.fetch(:env_prefix, DEFAULT_ENV_PREFIX)
end
Expand Down
2 changes: 1 addition & 1 deletion lib/webpacker/instance.rb
Expand Up @@ -36,6 +36,6 @@ def commands
end

def inlining_css?
dev_server.hmr? && dev_server.running?
dev_server.inline_css? && dev_server.hmr? && dev_server.running?
end
end
2 changes: 1 addition & 1 deletion package/inliningCss.js
Expand Up @@ -2,6 +2,6 @@ const { runningWebpackDevServer } = require('./env')
const devServer = require('./dev_server')

// This logic is tied to lib/webpacker/instance.rb
const inliningCss = runningWebpackDevServer && devServer.hmr
const inliningCss = runningWebpackDevServer && devServer.hmr && devServer.inlineCss !== false

module.exports = inliningCss
15 changes: 15 additions & 0 deletions test/webpacker_test.rb
Expand Up @@ -23,11 +23,26 @@ def dev_server.pretty?; false; end
def dev_server.https?; true; end
def dev_server.hmr?; true; end
def dev_server.running?; true; end
def dev_server.inline_css?; true; end
Webpacker.instance.stub(:dev_server, dev_server) do
assert Webpacker.inlining_css?
end
end

def test_explicit_no_inline_css_with_hmr
dev_server = Webpacker::DevServer.new({})
def dev_server.host; "localhost"; end
def dev_server.port; "3035"; end
def dev_server.pretty?; false; end
def dev_server.https?; true; end
def dev_server.hmr?; true; end
def dev_server.running?; true; end
def dev_server.inline_css?; false; end
Webpacker.instance.stub(:dev_server, dev_server) do
assert !Webpacker.inlining_css?
end
end

def test_app_autoload_paths_cleanup
assert_empty $test_app_autoload_paths_in_initializer
end
Expand Down

0 comments on commit 5c7eb2d

Please sign in to comment.