From 62ca37884af11dacca51ef35c43a7f4805c91c5f Mon Sep 17 00:00:00 2001 From: Eugen Rochko Date: Sat, 27 May 2017 16:55:09 +0200 Subject: [PATCH] Fix #2922 - Load stylesheet from "custom.css" entrypoint when present (#3332) * Fix #2922 - Load stylesheet from "custom.css" entrypoint when present This is pretty much the same way it worked as before, albeit with having to create app/javascript/packs/custom.js with require('../styles/custom.scss') (or whatever you want really), which will be a blank slate for you to import whatever you want * Remove old assets directory * Extract font-awesome into common.css and always load it --- app/assets/stylesheets/.gitkeep | 0 app/helpers/style_helper.rb | 17 +++++++++++++++++ app/javascript/mastodon/main.js | 6 ------ app/views/layouts/application.html.haml | 3 ++- config/webpack/shared.js | 6 ++++++ 5 files changed, 25 insertions(+), 7 deletions(-) delete mode 100644 app/assets/stylesheets/.gitkeep create mode 100644 app/helpers/style_helper.rb diff --git a/app/assets/stylesheets/.gitkeep b/app/assets/stylesheets/.gitkeep deleted file mode 100644 index e69de29bb..000000000 diff --git a/app/helpers/style_helper.rb b/app/helpers/style_helper.rb new file mode 100644 index 000000000..b695f8f3e --- /dev/null +++ b/app/helpers/style_helper.rb @@ -0,0 +1,17 @@ +# frozen_string_literal: true + +module StyleHelper + def stylesheet_for_layout + if asset_exist? 'custom.css' + 'custom' + else + 'application' + end + end + + def asset_exist?(path) + true if Webpacker::Manifest.lookup(path) + rescue Webpacker::FileLoader::NotFoundError + false + end +end diff --git a/app/javascript/mastodon/main.js b/app/javascript/mastodon/main.js index 44148fa92..2031cad16 100644 --- a/app/javascript/mastodon/main.js +++ b/app/javascript/mastodon/main.js @@ -1,8 +1,5 @@ const perf = require('./performance'); -// allow override variables here -require.context('../../assets/stylesheets/', false, /variables.*\.scss$/); - // import default stylesheet with variables require('font-awesome/css/font-awesome.css'); require('../styles/application.scss'); @@ -23,9 +20,6 @@ function main() { require.context('../images/', true); - // import customization styles - require.context('../../assets/stylesheets/', false, /custom.*\.scss$/); - onDomContentLoaded(() => { const mountNode = document.getElementById('mastodon'); const props = JSON.parse(mountNode.getAttribute('data-props')); diff --git a/app/views/layouts/application.html.haml b/app/views/layouts/application.html.haml index f991bc74f..ab7c22385 100755 --- a/app/views/layouts/application.html.haml +++ b/app/views/layouts/application.html.haml @@ -18,7 +18,8 @@ = ' - ' = title - = stylesheet_pack_tag 'application', media: 'all' + = stylesheet_pack_tag 'common', media: 'all' + = stylesheet_pack_tag stylesheet_for_layout, media: 'all' = javascript_pack_tag 'common', integrity: true, crossorigin: 'anonymous' = javascript_pack_tag "locale_#{I18n.locale}", integrity: true, crossorigin: 'anonymous' = csrf_meta_tags diff --git a/config/webpack/shared.js b/config/webpack/shared.js index 1d75e2af2..12e05dec2 100644 --- a/config/webpack/shared.js +++ b/config/webpack/shared.js @@ -53,6 +53,12 @@ module.exports = { // be loaded together return false; } + + if (module.resource && /node_modules\/font-awesome/.test(module.resource)) { + // extract vendor css into common module + return true; + } + return count >= 2; }, }),