svelte-on-rails 0.0.33 → 0.0.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (20) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +26 -32
  3. data/lib/generators/svelte_on_rails/install/install_generator.rb +14 -15
  4. data/lib/svelte-on-rails.rb +0 -10
  5. data/lib/svelte_on_rails/installer/hello_world.rb +19 -10
  6. data/lib/svelte_on_rails/installer/utils.rb +38 -14
  7. data/lib/tasks/svelte_on_rails_tasks.rake +1 -30
  8. metadata +1 -13
  9. data/lib/svelte_on_rails/installer/rails_template/app/controllers/svelte_on_rails_hello_world_controller.rb +0 -6
  10. data/lib/svelte_on_rails/installer/rails_template/app/frontend/images/atom.svg +0 -1
  11. data/lib/svelte_on_rails/installer/rails_template/app/frontend/images/check-circle-green.png +0 -0
  12. data/lib/svelte_on_rails/installer/rails_template/app/frontend/images/svg.svg +0 -3
  13. data/lib/svelte_on_rails/installer/rails_template/app/frontend/initializers/svelte.js +0 -18
  14. data/lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/components/Pug.svelte +0 -14
  15. data/lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/components/SvelteOnRailsHelloWorld.svelte +0 -66
  16. data/lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/components/sub/NestedComponent.svelte +0 -1
  17. data/lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/nestedJavascript.js +0 -3
  18. data/lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/nestedJavascriptToggled.js +0 -3
  19. data/lib/svelte_on_rails/installer/rails_template/app/views/svelte_on_rails_hello_world/index.haml +0 -5
  20. data/lib/svelte_on_rails/installer/rails_template/config/svelte_on_rails.yml +0 -23
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: a6f9ed8c84f7e12aa7b5274e385b5993567d7555fd33bfa79dd14e521b15f42d
4
- data.tar.gz: 26144ae39b7e5d75800391c8881a5d302e5c9afe11583c8c149a2d62f2a1544d
3
+ metadata.gz: 3b3b3a20bdc53e8344c4e03d88ace00eb01e7c9f9b05545ea626af2a6131ef45
4
+ data.tar.gz: ccc007c3e60640ad5707b9361d73ffd7967a9af439a86be6ad358d5024fcd76c
5
5
  SHA512:
6
- metadata.gz: eb94092930ef3bb2b7ac5c3cb5fec13e63e7086d917b11fc29e3633431ffafb94be69171d908c8b56b63d4ee3ad8597856eff91371d7ed777a329856f10887af
7
- data.tar.gz: a989e4e6bc29e6c25072ab61fb5bc748e15162f86eae30e6904eb26dfb894a534a744bf322baded1f35fdc2300dc11e245c63334002197e6c9ae1c36cb7a0c40
6
+ metadata.gz: f3ff1581778782262c1798b73aed2fabff57a9f29b9d473fe80c40d4d440005e6aea26d9b1b118ed2a4f2cb61b833a2c26ebc188c736d034d776ba32fbe13cca
7
+ data.tar.gz: 33a3971a817cc494dc8245bad803c008a30ca01026e04d2391619cab50f53184b7de8945ab98ade59895eaffd1750b57d3140825207787dfdb915a6849359e34
data/README.md CHANGED
@@ -1,4 +1,4 @@
1
- # Svelte. On rails! Awesome.
1
+ # Svelte on Rails
2
2
 
3
3
  Seamless and robust Svelte in Rails integration.
4
4
 
@@ -80,6 +80,14 @@ It tells you all what he is doing.
80
80
  At the end, you just have to (re-) start your server
81
81
  and you will see a Svelte component.
82
82
 
83
+ Then, you can run
84
+
85
+ ```bash
86
+ rails svelte_on_rails:remove_hello_world
87
+ ```
88
+
89
+ and start coding.
90
+
83
91
  ## Minimal Installation
84
92
 
85
93
  within the app folder
@@ -251,44 +259,30 @@ Example from the rails console for a medium complex component
251
259
 
252
260
  ## Testing
253
261
 
254
- Testings are within the gem by `rspec`. Mainly there are 2 types of tests:
262
+ Tests are based on the included templates, like the `hello world template` and on the installer.
255
263
 
256
- **compiler tests**
264
+ That means, basically, when you run a test, it creates a new rails app and runs the installer.
265
+ The destination folder is defined by the file `generated_test_app_path` within the gems root folder.
266
+ The string there must represent a full path to a existing folder.
257
267
 
258
- The folder `spec/rails_vite_test_app` holds a package.json
259
- with the `@csedl/svelte-on-rails` package, mainly because of the
260
- peer dependencies necessary for ssr tests, and some example components.
261
- This is mainly for testing the compiler.
262
-
263
- **installer tests**
264
-
265
- The folder `spec/installer_tests`, mainly, is emptied
266
- before test. Tests there are starting by `rails new` followed
267
- by running the installer.
268
+ When you want to develop the components, the workflow is:
268
269
 
270
+ - run a component test
271
+ - the first run is slow because the installer must build the app
272
+ - the second run is fast because the app is already built
273
+ - open the browser by localhost:3000
274
+ - change the component
275
+ - run the component test again
276
+ - see the changes in the browser
277
+
269
278
  NOTE: Theese tests are dependend on your environment, including the running ruby version!
270
- I am woring on `rvm` If you work on a different environment, tests may have to be adopted.
279
+ I am working on rvm. If you work on a different environment, some (not many) changes may be necessary.
280
+ Thats your part :)
271
281
 
272
282
  The current test cases including (among others):
273
283
 
274
- - create a completely new rails app, running the full installer and check if a `hello World` component is visible and javascript is working.
275
- - run `assets:precompile` within a rails app and check if the gem does its precompiling too.
276
-
277
- Development helpers:
278
-
279
- ```bash
280
- rake svelte_on_rails:create_test_app
281
- ```
282
-
283
- This creates a new rails app within `spec/installer_tests` and runs the installer with `--full`.
284
- On the last line it shows you the path to the test app.
285
- Now you can cd into this folder and run `rails s`.
286
-
287
- ```bash
288
- rake svelte_on_rails:replace_test_app_hello_world
289
- ```
290
-
291
- Overwrites the hello world files within this test app from template.
284
+ create a completely new rails app, running the full installer and check if a hello World component is visible and javascript is working.
285
+ run assets:precompile within a rails app and check if the gem does its precompiling too.
292
286
 
293
287
  ## Licence
294
288
 
@@ -37,11 +37,10 @@ module SvelteOnRails
37
37
  def svelte_on_rails
38
38
  utils = SvelteOnRails::Installer::Utils
39
39
  npm_i = SvelteOnRails::Installer::Npm
40
- utils.write_templates(['config/svelte_on_rails.yml'])
40
+ utils.write_templates(['svelte_on_rails_vite_base'])
41
41
  npm_i.install_or_update_package('@csedl/svelte-on-rails')
42
42
  # insert_initializer
43
43
  uts = SvelteOnRails::Installer::Utils
44
- uts.write_templates(['app/frontend/initializers/svelte.js'])
45
44
  # add import statements
46
45
  js_i = SvelteOnRails::Installer::Javascript
47
46
  init_stat = '../initializers/svelte.js'
@@ -74,7 +73,7 @@ module SvelteOnRails
74
73
  puts '-' * 80
75
74
 
76
75
  hw_i = SvelteOnRails::Installer::HelloWorld
77
- @hello_world_path = hw_i.install_hello_world(HELLO_WORLD_FILES)
76
+ @hello_world_path = hw_i.install_hello_world(['rails_vite_hello_world'], app_root: nil, force: true, silent: true)
78
77
  end
79
78
 
80
79
  def finish
@@ -90,18 +89,18 @@ module SvelteOnRails
90
89
  puts "Happy coding!"
91
90
  end
92
91
 
93
- HELLO_WORLD_FILES = %w[
94
- app/controllers/svelte_on_rails_hello_world_controller.rb
95
- app/views/svelte_on_rails_hello_world/index.haml
96
- app/frontend/javascript/components/SvelteOnRailsHelloWorld.svelte
97
- app/frontend/javascript/components/Pug.svelte
98
- app/frontend/javascript/components/sub/NestedComponent.svelte
99
- app/frontend/javascript/nestedJavascript.js
100
- app/frontend/javascript/nestedJavascriptToggled.js
101
- app/frontend/javascript/components/sub/NestedComponent.svelte
102
- app/frontend/images/svg.svg
103
- app/frontend/images/check-circle-green.png
104
- ]
92
+ # HELLO_WORLD_FILES = %w[
93
+ # app/controllers/svelte_on_rails_hello_world_controller.rb
94
+ # app/views/svelte_on_rails_hello_world/index.haml
95
+ # app/frontend/javascript/components/SvelteOnRailsHelloWorld.svelte
96
+ # app/frontend/javascript/components/Pug.svelte
97
+ # app/frontend/javascript/components/sub/NestedComponent.svelte
98
+ # app/frontend/javascript/nestedJavascript.js
99
+ # app/frontend/javascript/nestedJavascriptToggled.js
100
+ # app/frontend/javascript/components/sub/NestedComponent.svelte
101
+ # app/frontend/images/svg.svg
102
+ # app/frontend/images/check-circle-green.png
103
+ # ]
105
104
 
106
105
  private
107
106
 
@@ -37,14 +37,4 @@ module SvelteOnRails
37
37
  puts "Error running create_test_app task: #{e.message}"
38
38
  end
39
39
 
40
- def self.run_replace_hello_world_task
41
- # Ensure Rake tasks are loaded
42
- Rake::Task.define_task(:environment) # Define a dummy environment task (if needed)
43
- load File.expand_path('../rakefile', __FILE__) # Load the gem's Rakefile
44
-
45
- # Invoke the task
46
- Rake::Task['svelte_on_rails:replace_test_app_hello_world'].invoke
47
- rescue StandardError => e
48
- puts "Error running replace_test_app_hello_world task: #{e.message}"
49
- end
50
40
  end
@@ -2,15 +2,13 @@ module SvelteOnRails
2
2
  module Installer
3
3
  module HelloWorld
4
4
 
5
- def self.install_hello_world(files, force: false, app_root: nil)
5
+ def self.install_hello_world(templates, force: false, app_root: nil, silent: false)
6
6
 
7
7
  utils_i = SvelteOnRails::Installer::Utils
8
8
 
9
9
  # write templates
10
10
 
11
-
12
- utils_i.write_templates(files, ask_for_overwrite: !force, app_root: app_root)
13
-
11
+ utils_i.write_templates(templates, ask_for_overwrite: !force, app_root: app_root, silent: silent)
14
12
 
15
13
  # route
16
14
 
@@ -26,22 +24,33 @@ module SvelteOnRails
26
24
  puts "route «#{route}» already exists, skipping."
27
25
  url
28
26
  elsif rr
29
- utils_i.add_route(" get \"#{route.sub('#', '/')}\"")
27
+ utils_i.add_route(" get \"#{route.sub('#', '/')}\"", app_root: app_root)
30
28
  url
31
29
  else
32
- utils_i.add_route(' root "svelte_on_rails_hello_world#index"')
30
+ utils_i.add_route(' root "svelte_on_rails_hello_world#index"', app_root: app_root)
33
31
  root_url
34
32
  end
35
33
 
36
34
  end
37
35
 
38
- def self.remove_hello_world(files)
36
+ def self.remove_hello_world(templates = ['rails_vite_hello_world'], app_root: nil, ask: true)
39
37
 
40
38
  utils = SvelteOnRails::Installer::Utils
41
- if utils.ask_yn('Remove the Hello World component?')
42
- utils.remove_files(files)
43
- utils.remove_line_from_file('config/routes.rb', 'svelte_on_rails_hello_world')
39
+
40
+ files = utils.template_paths(templates, app_root: app_root)
41
+
42
+ existing_files = files.dup.select { |f| File.exist?(f[2]) }
43
+
44
+ return unless existing_files.any?
45
+ if ask
46
+ question = "Remove Hello World component?\nThe following files will be removed:\n#{existing_files.map { |f| f[1] }.join("\n")}"
47
+ return unless utils.ask_yn(question)
48
+ end
49
+
50
+ existing_files.each do |f|
51
+ File.delete(f[2])
44
52
  end
53
+ puts "Removed Hello World component files."
45
54
  end
46
55
 
47
56
  end
@@ -171,37 +171,61 @@ module SvelteOnRails
171
171
  end
172
172
  end
173
173
 
174
- def self.write_templates(template_paths, ask_for_overwrite: true, app_root: nil)
174
+ def self.write_templates(templates, ask_for_overwrite: true, app_root: nil, silent: false)
175
175
 
176
- a_root = app_root_path(app_root)
177
176
 
178
- existing = template_paths.select { |p| File.exist?(a_root.join(p)) }
177
+ paths = template_paths(templates, app_root: app_root)
178
+
179
+
180
+ existing = paths.dup.select { |p| File.exist?(p[2]) }
181
+
179
182
 
180
183
  if existing.present? && ask_for_overwrite
181
184
  begin
182
- puts "#{'Template'.pluralize(existing.length)} already exists:\n#{existing.join("\n")}.\nOverwrite? (y/n)"
185
+ puts "#{'File'.pluralize(existing.length)} already exists:\n#{existing.map { |p| p[1] }.join("\n")}.\nOverwrite? (y/n)"
183
186
  continue = STDIN.gets.chomp.downcase[0]
184
187
  end until ['y', 'n'].include?(continue)
185
188
  if continue == 'n'
186
- puts "Skipping write #{'template'.pluralize(template_paths.length)}."
189
+ puts "Skipping write #{'template'.pluralize(templates.length)}."
187
190
  return
188
191
  end
189
192
  end
190
193
 
191
- template_paths.each do |p|
192
- source_path = File.expand_path('rails_template', __dir__) + '/' + p
194
+ paths.each do |p|
193
195
 
194
- dest_path = a_root.join(p)
195
- v = (File.exist?(dest_path) ? 'replaced' : 'created')
196
+ v = (File.exist?(p[2]) ? 'replaced' : 'created')
196
197
 
197
- FileUtils.mkdir_p(File.dirname(a_root.join(p)))
198
- FileUtils.cp(source_path, a_root.join(p))
198
+ FileUtils.mkdir_p(File.dirname(p[2]))
199
+ FileUtils.cp(p.first, p[2])
199
200
 
200
- puts "#{v}: #{p}"
201
+ puts "#{v}: #{p[1]}" unless silent
201
202
  end
202
203
 
203
204
  end
204
205
 
206
+ def self.template_paths(templates, app_root: nil)
207
+ paths = []
208
+ app_root = app_root_path(app_root)
209
+
210
+ templates.each do |t|
211
+ templates_folder = File.expand_path("../../../templates", __dir__)
212
+ template_root = templates_folder + '/' + t
213
+ raise "ERROR: Template «#{t}» not found:\n#{template_root}" unless File.directory?(template_root)
214
+
215
+ files = Dir.glob(template_root + '/**/*').select { |e| File.file? e }
216
+ files.each do |f|
217
+ paths.push(
218
+ [
219
+ f,
220
+ f.gsub(template_root + '/', ''),
221
+ app_root.join(f.gsub(template_root + '/', ''))
222
+ ]
223
+ )
224
+ end
225
+ end
226
+ paths
227
+ end
228
+
205
229
  def self.ask_yn(question)
206
230
  begin
207
231
  puts "#{question} (y/n)"
@@ -221,9 +245,9 @@ module SvelteOnRails
221
245
  end
222
246
  end
223
247
 
224
- def self.add_route(route)
248
+ def self.add_route(route, app_root: nil)
225
249
 
226
- file_path = 'config/routes.rb'
250
+ file_path = app_root_path(app_root).join('config/routes.rb')
227
251
 
228
252
  # Read the file content
229
253
  content = File.read(file_path)
@@ -46,7 +46,7 @@ namespace :svelte_on_rails do
46
46
 
47
47
  puts '+++'
48
48
 
49
- toggler = File.expand_path('../svelte_on_rails/installer/rails_template', __dir__) + '/hello_world_toggler'
49
+ toggler = File.expand_path('../svelte_on_rails/installer/rails_vite_template', __dir__) + '/hello_world_toggler'
50
50
  if File.exist?(toggler)
51
51
  File.delete(toggler)
52
52
  File.delete('app/frontend/images/svg.svg')
@@ -72,33 +72,4 @@ namespace :svelte_on_rails do
72
72
  SvelteOnRails::Compiler.reset_and_compile_all
73
73
  end
74
74
 
75
- desc "Build test app within spec/installer_tests"
76
- task :create_test_app do
77
- TestHelpers.cleanup_rails_app
78
- TestHelpers.create_rails_app
79
- TestHelpers.gem_setup("rails g svelte_on_rails:install --full")
80
- puts '-'*80
81
- puts "Built test app successfully!"
82
- puts "You can now run the server by:"
83
- puts "$ cd #{TestHelpers.installer_test_app_path} && rails s"
84
- end
85
-
86
- desc "Build test app within spec/installer_tests"
87
- task :replace_test_app_hello_world do
88
- #require_relative '../../lib/svelte_on_rails/lib/utils'
89
- require_relative '../../spec/test_helpers'
90
- th = TestHelpers
91
- puts '-'*80
92
- hw_i = SvelteOnRails::Installer::HelloWorld
93
- #utils = SvelteOnRails::Lib::Utils
94
- @hello_world_path = hw_i.install_hello_world(
95
- SvelteOnRails::Generators::InstallGenerator::HELLO_WORLD_FILES,
96
- app_root: th.installer_test_app_path,
97
- force: true,
98
- )
99
-
100
- puts '-'*80
101
- puts "replaced Hello World component with new one"
102
- end
103
-
104
75
  end
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: svelte-on-rails
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.33
4
+ version: 0.0.35
5
5
  platform: ruby
6
6
  authors:
7
7
  - Christian Sedlmair
@@ -40,18 +40,6 @@ files:
40
40
  - lib/svelte_on_rails/installer/hello_world.rb
41
41
  - lib/svelte_on_rails/installer/javascript.rb
42
42
  - lib/svelte_on_rails/installer/npm.rb
43
- - lib/svelte_on_rails/installer/rails_template/app/controllers/svelte_on_rails_hello_world_controller.rb
44
- - lib/svelte_on_rails/installer/rails_template/app/frontend/images/atom.svg
45
- - lib/svelte_on_rails/installer/rails_template/app/frontend/images/check-circle-green.png
46
- - lib/svelte_on_rails/installer/rails_template/app/frontend/images/svg.svg
47
- - lib/svelte_on_rails/installer/rails_template/app/frontend/initializers/svelte.js
48
- - lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/components/Pug.svelte
49
- - lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/components/SvelteOnRailsHelloWorld.svelte
50
- - lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/components/sub/NestedComponent.svelte
51
- - lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/nestedJavascript.js
52
- - lib/svelte_on_rails/installer/rails_template/app/frontend/javascript/nestedJavascriptToggled.js
53
- - lib/svelte_on_rails/installer/rails_template/app/views/svelte_on_rails_hello_world/index.haml
54
- - lib/svelte_on_rails/installer/rails_template/config/svelte_on_rails.yml
55
43
  - lib/svelte_on_rails/installer/svelte.rb
56
44
  - lib/svelte_on_rails/installer/utils.rb
57
45
  - lib/svelte_on_rails/installer/vite.rb
@@ -1,6 +0,0 @@
1
- class SvelteOnRailsHelloWorldController < ApplicationController
2
-
3
- def index
4
- end
5
-
6
- end
@@ -1 +0,0 @@
1
- <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.0.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2022 Fonticons, Inc. --><path d="M256 224C238.3 224 223.1 238.4 223.1 256S238.3 288 256 288c17.62 0 32-14.38 32-32C287.9 238.4 273.6 224 256 224zM471.2 128c-15.62-27.75-49.62-41.38-93.11-41.38c-9.499 .125-18.87 .75-28.25 2C327.1 34.38 293.5 0 256 0S184.9 34.38 162.1 88.62c-9.374-1.25-18.75-1.875-28.25-2C90.39 86.62 56.4 100.2 40.78 128c-18.75 33.5-6.499 80.62 27.62 128c-34.12 47.38-46.37 94.5-27.62 128c15.62 27.75 49.62 41.38 93.11 41.38c9.499-.125 18.87-.75 28.25-2C184.9 477.6 218.5 512 256 512s71.12-34.38 93.86-88.63c9.374 1.25 18.75 1.875 28.25 2c43.49 0 77.49-13.62 93.11-41.38c18.75-33.5 6.499-80.63-27.62-128C477.7 208.6 489.1 161.5 471.2 128zM256 48c14.37 0 32.12 18.12 47.12 50C287.1 102.4 271.4 107.8 256 114.1c-15.37-6.375-31.12-11.76-47.12-16.14C223.9 66.12 241.6 48 256 48zM133.9 377.4c-26.5 0-46.74-6.625-52.74-17.38c-7.124-12.75-.5-37.63 18.62-66.63C111.4 305.2 123.8 316.5 136.8 327c2.25 16.5 5.374 33 9.624 49.13C142.3 376.4 137.9 377.4 133.9 377.4zM136.8 185C123.8 195.5 111.4 206.8 99.77 218.6C80.65 189.6 74.02 164.8 81.15 152c5.999-10.75 26.25-17.38 52.74-17.38c3.1 0 8.374 1 12.5 1.25C142.1 152 139 168.5 136.8 185zM256 464c-14.37 0-32.12-18.12-47.12-49.1C224.9 409.6 240.6 404.2 256 397.9c15.37 6.375 31.12 11.76 47.12 16.14C288.1 445.9 270.4 464 256 464zM256 352c-52.99 0-95.99-43-95.99-96S203 160 256 160s95.99 43 95.99 96S308.1 352 256 352zM430.9 360c-5.999 10.75-26.25 17.38-52.74 17.38c-3.1 0-8.374-1-12.5-1.25C369.9 360 372.1 343.5 375.2 327c12.1-10.5 25.37-21.75 36.1-33.63C431.4 322.4 437.1 347.2 430.9 360zM412.2 218.6C400.6 206.8 388.2 195.5 375.2 185C372.1 168.5 369.9 152 365.6 135.9c4.125-.25 8.499-1.25 12.5-1.25c26.5 0 46.74 6.625 52.74 17.38C437.1 164.8 431.4 189.6 412.2 218.6z"/></svg>
@@ -1,3 +0,0 @@
1
- <svg width="100" height="50" xmlns="http://www.w3.org/2000/svg">
2
- <text x="10" y="30" font-family="Arial, sans-serif" font-size="24" fill="black">svg</text>
3
- </svg>
@@ -1,18 +0,0 @@
1
-
2
- import { initializeSvelteComponents, cleanupSvelteComponents } from '@csedl/svelte-on-rails';
3
-
4
- const components = import.meta.glob('/javascript/components/**/*.svelte', { eager: true });
5
- const componentsRoot = '/javascript/components';
6
-
7
- // Initialize Svelte components
8
- initializeSvelteComponents(componentsRoot, components, true);
9
-
10
- // Turbo event listener for page load
11
- document.addEventListener('turbo:load', () => {
12
- initializeSvelteComponents(componentsRoot, components, true);
13
- });
14
-
15
- // Turbo event listener for cleanup before page cache
16
- document.addEventListener('turbo:before-cache', () => {
17
- cleanupSvelteComponents(false);
18
- });
@@ -1,14 +0,0 @@
1
- <script>
2
- export let notice
3
- let ary = ['item-1', 'item-2', 'item-3']
4
- </script>
5
-
6
- <template lang="pug">
7
- h1 Hello, Pug!
8
- p {notice}
9
- ul
10
- <!-- The | Syntax is a workaround for situations where pug integration in svelte is not working really well-->
11
- | {#each ary as item}
12
- | <li>{item}</li>
13
- | {/each}
14
- </template>
@@ -1,66 +0,0 @@
1
- <script>
2
- import svgRaw from '../../images/svg.svg?raw'
3
- //import svg from '../../images/svg.svg'
4
- import png from '../../images/check-circle-green.png'
5
- import Nested from './sub/NestedComponent.svelte'
6
- import {nestedJavascriptFunction} from '../nestedJavascript.js'
7
- export let items
8
- let count = 0;
9
-
10
- function increment() {
11
- count += 1;
12
- }
13
- </script>
14
-
15
- <span class="svelte-component-wrapper">
16
- <h1>Svelte is here!</h1>
17
-
18
- <hr/>
19
- <p>click the button and check if the component is alive</p>
20
- <button on:click={increment}>Increment: {count}</button>
21
-
22
- <hr/>
23
- <ul>
24
- {#each items as item}
25
- <li>{item}</li>
26
- {/each}
27
- </ul>
28
-
29
- <hr/>
30
- <span class="wrap-svg">{@html svgRaw}</span>
31
- <!-- <img alt="svg ERROR" src={svg} />-->
32
- <img alt="png ERROR" src={png} />
33
-
34
- <hr/>
35
- <Nested />
36
-
37
- <hr/>
38
- <p>{nestedJavascriptFunction()}</p>
39
- </span>
40
-
41
- <style>
42
- button {
43
- background-color: darkred;
44
- color: white;
45
- padding: 10px;
46
- border: none;
47
- cursor: pointer;
48
- }
49
-
50
- .svelte-component-wrapper {
51
- border: 1px solid black;
52
- padding: 10px;
53
- margin: 10px;
54
- background-color: #efefef;
55
- display: inline-block;
56
- box-shadow: 2px 3px 16px -1px rgba(0, 0, 0, 0.75);
57
- -webkit-box-shadow: 2px 3px 16px -1px rgba(0, 0, 0, 0.75);
58
- -moz-box-shadow: 2px 3px 16px -1px rgba(0, 0, 0, 0.75);
59
- }
60
- img, .wrap-svg {
61
- display: inline-block;
62
- width: 30px;
63
- height: 30px;
64
- margin: 30px;
65
- }
66
- </style>
@@ -1,3 +0,0 @@
1
- export function nestedJavascriptFunction() {
2
- return 'nestedJavascript!';
3
- }
@@ -1,3 +0,0 @@
1
- export function nestedJavascriptFunction() {
2
- return 'nestedJavascript («toggled»)';
3
- }
@@ -1,5 +0,0 @@
1
- %p Example view
2
-
3
- = svelte_component "SvelteOnRailsHelloWorld", items: ['attributes', 'are', 'parsed']
4
- = svelte_component "Pug", ssr: true, notice: "Pug is rendered server-side"
5
- = svelte_component "Pug", ssr: false, notice: "Pug is rendered client-side"
@@ -1,23 +0,0 @@
1
- frontend_folder: "app/frontend"
2
- # the entrypoint that is your web root, example for vite: where @ points to
3
- # relative to Rails.root
4
-
5
- components_folder: "javascript/components"
6
- # relative to frontend_folder
7
- # where your svelte components are located
8
-
9
- ssr: :auto
10
- # options: true, false, :auto
11
- # :auto: render server side if request is initial request (works only with turbo, because it checks for the X-Turbo-Request-ID header)
12
- # when not server-side rendered the components must be built as custom elements, see node-package @csedl/svelte-on-rails
13
-
14
- development:
15
- watch_changes: true
16
- # Check on every request if any file within the svelte components folder have changed, for recompiling
17
- # Case sensitive path checking, even the file system is case insensitive
18
- # Make sure this ist set to tue for development and test, but not for production
19
-
20
- test:
21
- watch_changes: true
22
-
23
- production: