diff --git a/CHANGELOG.md b/CHANGELOG.md index c2ba9138..db55f9ba 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -6,6 +6,12 @@ Features - Updates ActiveAdmin installation to use webpacker [#350](https://github.com/platanus/potassium/pull/350) - Replaces Active Skin with Arctic Admin [#350](https://github.com/platanus/potassium/pull/350) +Fixes + - Forces `vue-loader` version to 15, as 16 requires `@vue/compiler-sfc`, which is a part of Vue 3 + - Changes Content Security Policy added by GTM recipe to: + - Include the same config regardless of environment + - Include `unsafe_eval` in `script_src`, as it is required for Vue's compiler build + ## 6.3.0 Features: diff --git a/lib/potassium/recipes/front_end.rb b/lib/potassium/recipes/front_end.rb index 7aa016ec..9e4f8605 100644 --- a/lib/potassium/recipes/front_end.rb +++ b/lib/potassium/recipes/front_end.rb @@ -1,4 +1,6 @@ class Recipes::FrontEnd < Rails::AppBuilder + VUE_LOADER_VERSION = Potassium::VUE_LOADER_VERSION + def ask frameworks = { vue: "Vue", @@ -21,13 +23,7 @@ def create run "rails webpacker:install" run "rails webpacker:install:#{value}" unless [:none, :None].include? value.to_sym - if value == :vue - recipe.setup_vue_with_compiler_build - recipe.setup_jest - if get(:api) == :graphql - recipe.setup_apollo - end - end + recipe.setup_vue if value == :vue recipe.add_responsive_meta_tag recipe.setup_tailwind add_readme_header :webpack @@ -106,6 +102,19 @@ def setup_apollo ) end + def foce_vue_loader_version + run "bin/yarn add vue-loader@#{VUE_LOADER_VERSION}" + end + + def setup_vue + foce_vue_loader_version + setup_vue_with_compiler_build + setup_jest + if get(:api) == :graphql + setup_apollo + end + end + private def frameworks(framework) diff --git a/lib/potassium/recipes/google_tag_manager.rb b/lib/potassium/recipes/google_tag_manager.rb index e3a3b36b..0a4c4165 100644 --- a/lib/potassium/recipes/google_tag_manager.rb +++ b/lib/potassium/recipes/google_tag_manager.rb @@ -68,22 +68,26 @@ def render_string(file_path) def content_security_policy_code <<~HERE Rails.application.config.content_security_policy do |policy| - if Rails.env.development? - policy.connect_src :self, :https, 'http://localhost:3035', 'ws://localhost:3035' - policy.script_src :self, :https, :unsafe_eval - else - policy.script_src :self, :https - # google tag manager requires to enable unsafe inline: - # https://developers.google.com/tag-manager/web/csp - policy.connect_src :self, :https, 'https://www.google-analytics.com' - policy.script_src :self, - :https, - :unsafe_inline, - 'https://www.googletagmanager.com', - 'https://www.google-analytics.com', - 'https://ssl.google-analytics.com' - policy.img_src :self, :https, 'https://www.googletagmanager.com', 'https://www.google-analytics.com' - end + policy.connect_src( + :self, + :https, + 'http://localhost:3035', + 'ws://localhost:3035', + 'https://www.google-analytics.com' + ) + # google tag manager requires to enable unsafe inline and vue unsave eval: + # https://developers.google.com/tag-manager/web/csp + # https://vuejs.org/v2/guide/installation.html#CSP-environments + policy.script_src( + :self, + :https, + :unsafe_inline, + :unsafe_eval, + 'https://www.googletagmanager.com', + 'https://www.google-analytics.com', + 'https://ssl.google-analytics.com' + ) + policy.img_src :self, :https, 'https://www.googletagmanager.com', 'https://www.google-analytics.com' end HERE end diff --git a/lib/potassium/version.rb b/lib/potassium/version.rb index b8a25da0..fbaf4264 100644 --- a/lib/potassium/version.rb +++ b/lib/potassium/version.rb @@ -8,4 +8,5 @@ module Potassium MYSQL_VERSION = "5.7" NODE_VERSION = "12" TAILWINDCSS = "npm:@tailwindcss/postcss7-compat" + VUE_LOADER_VERSION = "^15.9.7" end diff --git a/spec/features/front_end_spec.rb b/spec/features/front_end_spec.rb index 9b319543..b7101434 100644 --- a/spec/features/front_end_spec.rb +++ b/spec/features/front_end_spec.rb @@ -64,6 +64,10 @@ def expect_to_have_tailwind_compatibility_build expect_to_have_tailwind_compatibility_build end + it 'includes correct version of vue-loader in package' do + expect(node_modules_file).to include("\"vue-loader\": \"#{Potassium::VUE_LOADER_VERSION}\"") + end + context "with graphql" do before(:all) do remove_project_directory diff --git a/spec/features/google_tag_manager_spec.rb b/spec/features/google_tag_manager_spec.rb index a4c2b220..04007829 100644 --- a/spec/features/google_tag_manager_spec.rb +++ b/spec/features/google_tag_manager_spec.rb @@ -31,29 +31,6 @@ it 'add content security policy' do expect(content_security_policy_file) - .to include(content_security_policy_code) - end - - def content_security_policy_code - <<~HERE - Rails.application.config.content_security_policy do |policy| - if Rails.env.development? - policy.connect_src :self, :https, 'http://localhost:3035', 'ws://localhost:3035' - policy.script_src :self, :https, :unsafe_eval - else - policy.script_src :self, :https - # google tag manager requires to enable unsafe inline: - # https://developers.google.com/tag-manager/web/csp - policy.connect_src :self, :https, 'https://www.google-analytics.com' - policy.script_src :self, - :https, - :unsafe_inline, - 'https://www.googletagmanager.com', - 'https://www.google-analytics.com', - 'https://ssl.google-analytics.com' - policy.img_src :self, :https, 'https://www.googletagmanager.com', 'https://www.google-analytics.com' - end - end - HERE + .to include("\nRails.application.config.content_security_policy do |policy|") end end