17 Matching Annotations
  1. Jul 2020
    1. Unlike the webpack config, webpacker.yml settings are determined by the current RAILS_ENV.
    2. All this to say: your webpack test config, i.e. config/webpack/test.js, is essentially useless unless your application: a. uses a Node.js test runner for JavaScript unit test AND configure it to use your webpack config a. overrides the defaults so that the test config is loaded in your Rails tests (just be sure to change Babel behavior)
  2. Oct 2019
    1. if I reference a stylesheet in a JS pack application.js but DON'T include <%= stylesheet_pack_tag 'application' %> in my .html.erb file, then those styles will not be applied? Correct, unless you are using webpack dev server, in which case the CSS will be inlined with JS.
    1. I don't have anything to add other than "extract_css" in webpacker.yml has been a source of confusion for me as well. When it is "extract_css: false" in development and production, a stylesheet IS included in the document head (shouldn't this be "extract_css: true"?). And when I use "extract_css: true", styles are not included in the document.
    1. You probably have extract_css: true in your webpacker.yml. This removes import '../scss/index'; and generates the equivalent style sheet. You do need to add stylesheet_pack_tag yourself.
    2. (if extract_css == true) -> application stylesheet -> MiniCssExtractPlugin -> application.css -> stylesheet_pack_tag 'application' (if extract_css == false) -> application stylesheet -> style-loader -> application.js (loads css in head)
    3. When you do import '../src/application.css', you're telling webpack include application.css in the build. This does not mean it's going to be compiled into your javascript, only that webpack now knows that you want to compile this file. How that file compilation is handled is depending on how your loaders (css-loader, sass-loader, file-loader, etc.. ) are configured.
  3. Sep 2019