svelte-on-rails 0.0.41 → 0.0.43
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.
- checksums.yaml +4 -4
- data/README.md +18 -58
- data/lib/generators/svelte_on_rails/install/install_generator.rb +25 -18
- data/lib/svelte-on-rails.rb +0 -1
- data/lib/svelte_on_rails/configuration.rb +42 -5
- data/lib/svelte_on_rails/installer/hello_world.rb +5 -1
- data/lib/svelte_on_rails/installer/npm.rb +1 -1
- data/lib/svelte_on_rails/lib/development_utils.rb +24 -11
- data/lib/svelte_on_rails/lib/utils.rb +37 -1
- data/lib/svelte_on_rails/renderer/renderer.rb +6 -1
- data/lib/svelte_on_rails/renderer/utils.js +2 -1
- data/lib/svelte_on_rails/view_helpers.rb +1 -3
- data/lib/tasks/svelte_on_rails_tasks.rake +25 -31
- data/templates/config_base/app/frontend/ssr/ssr.js +4 -0
- data/templates/config_base/vite-ssr.config.ts +133 -0
- data/templates/rails_vite_hello_world/app/frontend/images/svelte-on-rails-hello-world-england.png +0 -0
- data/templates/rails_vite_hello_world/app/frontend/images/svelte-on-rails-hello-world-face-smile-wink.svg +1 -0
- data/templates/rails_vite_hello_world/app/frontend/images/svelte-on-rails-hello-world-switzerland.jpg +0 -0
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/JavascriptImport.svelte +7 -0
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/JpgImport.svelte +7 -0
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/ParentWithChild.svelte +6 -0
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/PngImport.svelte +7 -0
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/SvelteOnRailsHelloWorld.svelte +2 -6
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/SvgRawImport.svelte +7 -0
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/sub/NestedComponent.svelte +1 -1
- data/templates/rails_vite_hello_world/app/frontend/javascript/nestedJavascript.js +4 -1
- data/templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/_nav.html.erb +11 -0
- data/templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/_styles.html.erb +16 -0
- data/templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/backend_frontend_rendered.html.erb +37 -0
- data/templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/index.html.erb +8 -4
- data/templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/ssr_auto_rendered.html.erb +26 -0
- metadata +17 -10
- data/lib/svelte_on_rails/compiler/compile.js +0 -123
- data/lib/svelte_on_rails/compiler/compiler.rb +0 -120
- data/lib/svelte_on_rails/compiler/customPlugins.js +0 -60
- data/templates/rails_vite_hello_world/app/frontend/images/atom.svg +0 -1
- data/templates/rails_vite_hello_world/app/frontend/images/check-circle-green.png +0 -0
- data/templates/rails_vite_hello_world/app/frontend/images/svg.svg +0 -3
- data/templates/rails_vite_hello_world/app/frontend/javascript/components/Pug.svelte +0 -14
- /data/templates/{svelte_on_rails_vite_base → config_base}/app/frontend/initializers/svelte.js +0 -0
- /data/templates/{svelte_on_rails_vite_base → config_base}/config/svelte_on_rails.yml +0 -0
@@ -0,0 +1,133 @@
|
|
1
|
+
import { defineConfig } from 'vite';
|
2
|
+
import RubyPlugin from 'vite-plugin-ruby';
|
3
|
+
import { svelte } from '@sveltejs/vite-plugin-svelte';
|
4
|
+
import * as fs from 'fs';
|
5
|
+
import * as path from 'path';
|
6
|
+
import { Plugin } from 'vite';
|
7
|
+
|
8
|
+
function rewriteAssetPathsPlugin(): Plugin {
|
9
|
+
const manifestPath = path.resolve('public/vite/manifest.json');
|
10
|
+
let manifest: Record<string, { file: string }> | null = null;
|
11
|
+
|
12
|
+
// Load client-side manifest if it exists (production)
|
13
|
+
if (fs.existsSync(manifestPath)) {
|
14
|
+
manifest = JSON.parse(fs.readFileSync(manifestPath, 'utf-8'));
|
15
|
+
}
|
16
|
+
|
17
|
+
return {
|
18
|
+
name: 'rewrite-asset-paths',
|
19
|
+
enforce: 'pre',
|
20
|
+
transform(code, id) {
|
21
|
+
if (id.endsWith('.svelte')) {
|
22
|
+
if (manifest) {
|
23
|
+
// Production: Rewrite asset paths using client-side manifest
|
24
|
+
let transformedCode = code;
|
25
|
+
for (const [assetKey, assetData] of Object.entries(manifest)) {
|
26
|
+
// Match assets like /assets/image.jpg, /assets/script.js, /assets/style.css
|
27
|
+
const assetRegex = new RegExp(`/assets/${assetKey.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')}`, 'g');
|
28
|
+
transformedCode = transformedCode.replace(assetRegex, `/vite/${assetData.file}`);
|
29
|
+
}
|
30
|
+
return transformedCode;
|
31
|
+
} else {
|
32
|
+
// Development: Fallback to /vite-dev/assets/ for all assets
|
33
|
+
return code.replace(/\/assets\//g, '/vite-dev/assets/');
|
34
|
+
}
|
35
|
+
}
|
36
|
+
return null;
|
37
|
+
},
|
38
|
+
};
|
39
|
+
}
|
40
|
+
|
41
|
+
// Function to recursively find all .svelte files
|
42
|
+
function findSvelteFiles(dir: string, baseDir: string = dir): Record<string, string> {
|
43
|
+
const entries: Record<string, string> = {};
|
44
|
+
const files = fs.readdirSync(dir, { withFileTypes: true });
|
45
|
+
|
46
|
+
for (const file of files) {
|
47
|
+
const fullPath = path.join(dir, file.name);
|
48
|
+
if (file.isDirectory()) {
|
49
|
+
// Recurse into subdirectories
|
50
|
+
Object.assign(entries, findSvelteFiles(fullPath, baseDir));
|
51
|
+
} else if (file.isFile() && file.name.endsWith('.svelte')) {
|
52
|
+
// Create entry for .svelte file
|
53
|
+
const relativePath = path.relative(baseDir, fullPath);
|
54
|
+
const name = relativePath.replace('.svelte', '').replace(/\//g, '-'); // e.g., components-MyComponent
|
55
|
+
entries[`svelte-${name}`] = fullPath;
|
56
|
+
}
|
57
|
+
}
|
58
|
+
return entries;
|
59
|
+
}
|
60
|
+
|
61
|
+
// Collect all .svelte files in app/frontend
|
62
|
+
const svelteComponents = findSvelteFiles(path.resolve('app/frontend'));
|
63
|
+
|
64
|
+
export default defineConfig(({ mode }) => {
|
65
|
+
|
66
|
+
const isProduction = (process.env.RAILS_ENV === 'development' || process.env.RAILS_ENV === 'test' ? false : true);
|
67
|
+
|
68
|
+
return {
|
69
|
+
base: isProduction ? '/vite/' : '/vite-dev/',
|
70
|
+
plugins: [
|
71
|
+
rewriteAssetPathsPlugin(),
|
72
|
+
{
|
73
|
+
...RubyPlugin(),
|
74
|
+
apply(config, { command }) {
|
75
|
+
if (command === 'build') {
|
76
|
+
if (config.plugins) { // Add this check
|
77
|
+
config.plugins = config.plugins.filter((plugin) => {
|
78
|
+
return !!(plugin && typeof plugin === 'object' && 'name' in plugin && plugin.name !== 'vite-plugin-ruby:assets-manifest');
|
79
|
+
});
|
80
|
+
}
|
81
|
+
}
|
82
|
+
return true;
|
83
|
+
},
|
84
|
+
},
|
85
|
+
svelte({
|
86
|
+
include: ['app/frontend/**/*.svelte'],
|
87
|
+
compilerOptions: {
|
88
|
+
// hydratable: false,
|
89
|
+
},
|
90
|
+
}),
|
91
|
+
{
|
92
|
+
name: 'force-manifest',
|
93
|
+
configResolved(config) {
|
94
|
+
console.log('Resolved build.manifest:', config.build.manifest);
|
95
|
+
if (!config.build.manifest) {
|
96
|
+
config.build.manifest = 'manifest-ssr.json';
|
97
|
+
console.log('Forced build.manifest to manifest-ssr.json');
|
98
|
+
}
|
99
|
+
},
|
100
|
+
},
|
101
|
+
],
|
102
|
+
build: {
|
103
|
+
ssr: true,
|
104
|
+
outDir: 'public/vite-ssr',
|
105
|
+
manifest: 'manifest.json',
|
106
|
+
rollupOptions: {
|
107
|
+
input: {
|
108
|
+
...svelteComponents,
|
109
|
+
ssr: 'app/frontend/ssr/ssr.js',
|
110
|
+
},
|
111
|
+
output: {
|
112
|
+
format: 'es',
|
113
|
+
entryFileNames: 'assets/[name]-[hash].js',
|
114
|
+
chunkFileNames: 'assets/[name]-[hash].js',
|
115
|
+
assetFileNames: 'assets/[name]-[hash][extname]',
|
116
|
+
manualChunks(id) {
|
117
|
+
if (id.indexOf('.svelte') !== -1) {
|
118
|
+
const lastSegment = id.split('/').pop();
|
119
|
+
if (lastSegment) {
|
120
|
+
const componentName = lastSegment.replace('.svelte', '');
|
121
|
+
return `svelte-${componentName}`;
|
122
|
+
}
|
123
|
+
}
|
124
|
+
}
|
125
|
+
},
|
126
|
+
},
|
127
|
+
},
|
128
|
+
optimizeDeps: {
|
129
|
+
include: ['svelte'],
|
130
|
+
},
|
131
|
+
logLevel: 'info',
|
132
|
+
};
|
133
|
+
});
|
data/templates/rails_vite_hello_world/app/frontend/images/svelte-on-rails-hello-world-england.png
ADDED
Binary file
|
@@ -0,0 +1 @@
|
|
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="M0 256C0 114.6 114.6 0 256 0C397.4 0 512 114.6 512 256C512 397.4 397.4 512 256 512C114.6 512 0 397.4 0 256zM164.1 325.5C158.3 318.8 148.2 318.1 141.5 323.9C134.8 329.7 134.1 339.8 139.9 346.5C162.1 372.1 200.9 400 255.1 400C311.1 400 349.8 372.1 372.1 346.5C377.9 339.8 377.2 329.7 370.5 323.9C363.8 318.1 353.7 318.8 347.9 325.5C329.9 346.2 299.4 368 255.1 368C212.6 368 182 346.2 164.1 325.5H164.1zM176.4 176C158.7 176 144.4 190.3 144.4 208C144.4 225.7 158.7 240 176.4 240C194 240 208.4 225.7 208.4 208C208.4 190.3 194 176 176.4 176zM300.8 233.6C318.4 210.1 353.6 210.1 371.2 233.6C376.5 240.7 386.5 242.1 393.6 236.8C400.7 231.5 402.1 221.5 396.8 214.4C366.4 173.9 305.6 173.9 275.2 214.4C269.9 221.5 271.3 231.5 278.4 236.8C285.5 242.1 295.5 240.7 300.8 233.6z"/></svg>
|
Binary file
|
@@ -1,7 +1,5 @@
|
|
1
1
|
<script>
|
2
|
-
import
|
3
|
-
//import svg from '../../images/svg.svg'
|
4
|
-
import png from '../../images/check-circle-green.png'
|
2
|
+
import jpg from '../../images/svelte-on-rails-hello-world-switzerland.jpg'
|
5
3
|
import Nested from './sub/NestedComponent.svelte'
|
6
4
|
import {nestedJavascriptFunction} from '../nestedJavascript.js'
|
7
5
|
export let items
|
@@ -27,9 +25,7 @@
|
|
27
25
|
</ul>
|
28
26
|
|
29
27
|
<hr/>
|
30
|
-
<
|
31
|
-
<!-- <img alt="svg ERROR" src={svg} />-->
|
32
|
-
<img alt="png ERROR" src={png} />
|
28
|
+
<img alt="png ERROR" src={jpg} />
|
33
29
|
|
34
30
|
<hr/>
|
35
31
|
<Nested />
|
data/templates/rails_vite_hello_world/app/frontend/javascript/components/sub/NestedComponent.svelte
CHANGED
@@ -1 +1 @@
|
|
1
|
-
<p>Nested Svelte Component</p>
|
1
|
+
<p class="nested-component">Nested Svelte Component</p>
|
@@ -0,0 +1,11 @@
|
|
1
|
+
<div class="nav">
|
2
|
+
<%= link_to 'Hello World', '/svelte_on_rails_hello_world/index' %>
|
3
|
+
|
|
4
|
+
<%= link_to 'Backend/Frontend Test', '/svelte_on_rails_hello_world/backend_frontend_rendered' %>
|
5
|
+
|
|
6
|
+
<%= link_to 'SSR-Auto rendered (default)', '/svelte_on_rails_hello_world/ssr_auto_rendered' %>
|
7
|
+
</div>
|
8
|
+
|
9
|
+
<% turbo_id = request.headers['X-Turbo-Request-ID'] %>
|
10
|
+
<p class="<%= (turbo_id.present? ? 'turbo-request' : 'initial-request') %>"><%= (turbo_id.blank? ? 'This is a initial request' : "Turbo-Request-ID: #{turbo_id}") %></p>
|
11
|
+
<p>Rails.environment: <%= Rails.env %></p>
|
@@ -0,0 +1,37 @@
|
|
1
|
+
<%= render 'styles' %>
|
2
|
+
<style>
|
3
|
+
.svelte-component {
|
4
|
+
border: 1px solid lightgray;
|
5
|
+
padding: 10px;
|
6
|
+
margin: 10px;
|
7
|
+
width: 100px;
|
8
|
+
display: inline-block;
|
9
|
+
}
|
10
|
+
</style>
|
11
|
+
|
12
|
+
<%= render 'nav' %>
|
13
|
+
|
14
|
+
|
15
|
+
<h1>SSR / Client side rendering test</h1>
|
16
|
+
<p>On the always client side rendered components you will see a unpleasant «blink» on the initial request.</p>
|
17
|
+
<p>After rendering both, client and server side rendered components, must look similar for making sure that on ssr:
|
18
|
+
:auto (which is default)
|
19
|
+
no unpleasant «blink» is appearing.</p>
|
20
|
+
<hr>
|
21
|
+
|
22
|
+
<% components = ['SvgRawImport', 'JpgImport', 'PngImport', 'JavascriptImport', 'ParentWithChild'] %>
|
23
|
+
|
24
|
+
<h3>Always rendered server side</h3>
|
25
|
+
<div class="ssr-only">
|
26
|
+
<% components.each do |component| %>
|
27
|
+
<%= svelte_component(component, ssr: true, hydrate: false, title: component) %>
|
28
|
+
<% end %>
|
29
|
+
</div>
|
30
|
+
|
31
|
+
<hr>
|
32
|
+
<h3>Always rendered client side</h3>
|
33
|
+
<div class="client-only">
|
34
|
+
<% components.each do |component| %>
|
35
|
+
<%= svelte_component(component, ssr: false, hydrate: true, title: component) %>
|
36
|
+
<% end %>
|
37
|
+
</div>
|
@@ -1,5 +1,9 @@
|
|
1
|
-
|
1
|
+
<%= render 'styles' %>
|
2
2
|
|
3
|
-
|
4
|
-
<%=
|
5
|
-
|
3
|
+
|
4
|
+
<%= render 'nav' %>
|
5
|
+
|
6
|
+
|
7
|
+
<h1>Svelte is here</h1>
|
8
|
+
|
9
|
+
<%= svelte_component "SvelteOnRailsHelloWorld", items: ['attributes', 'are', 'parsed'] %>
|
@@ -0,0 +1,26 @@
|
|
1
|
+
<%= render 'styles' %>
|
2
|
+
<style>
|
3
|
+
.svelte-component {
|
4
|
+
border: 1px solid lightgray;
|
5
|
+
padding: 10px;
|
6
|
+
margin: 10px;
|
7
|
+
width: 100px;
|
8
|
+
display: inline-block;
|
9
|
+
}
|
10
|
+
</style>
|
11
|
+
|
12
|
+
<%= render 'nav' %>
|
13
|
+
|
14
|
+
|
15
|
+
<h1>ssr: :auto (default)</h1>
|
16
|
+
|
17
|
+
|
18
|
+
<% components = ['SvgRawImport', 'JpgImport', 'PngImport', 'JavascriptImport', 'ParentWithChild'] %>
|
19
|
+
|
20
|
+
<h3>Rendered server side only on initial request</h3>
|
21
|
+
<div class="ssr-auto">
|
22
|
+
<% components.each do |component| %>
|
23
|
+
<%= svelte_component(component, title: component) %>
|
24
|
+
<% end %>
|
25
|
+
</div>
|
26
|
+
|
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.
|
4
|
+
version: 0.0.43
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Christian Sedlmair
|
@@ -31,9 +31,6 @@ files:
|
|
31
31
|
- README.md
|
32
32
|
- lib/generators/svelte_on_rails/install/install_generator.rb
|
33
33
|
- lib/svelte-on-rails.rb
|
34
|
-
- lib/svelte_on_rails/compiler/compile.js
|
35
|
-
- lib/svelte_on_rails/compiler/compiler.rb
|
36
|
-
- lib/svelte_on_rails/compiler/customPlugins.js
|
37
34
|
- lib/svelte_on_rails/configuration.rb
|
38
35
|
- lib/svelte_on_rails/installer/gem_utils.rb
|
39
36
|
- lib/svelte_on_rails/installer/haml.rb
|
@@ -52,18 +49,28 @@ files:
|
|
52
49
|
- lib/svelte_on_rails/renderer/utils.js
|
53
50
|
- lib/svelte_on_rails/view_helpers.rb
|
54
51
|
- lib/tasks/svelte_on_rails_tasks.rake
|
52
|
+
- templates/config_base/app/frontend/initializers/svelte.js
|
53
|
+
- templates/config_base/app/frontend/ssr/ssr.js
|
54
|
+
- templates/config_base/config/svelte_on_rails.yml
|
55
|
+
- templates/config_base/vite-ssr.config.ts
|
55
56
|
- templates/rails_vite_hello_world/app/controllers/svelte_on_rails_hello_world_controller.rb
|
56
|
-
- templates/rails_vite_hello_world/app/frontend/images/
|
57
|
-
- templates/rails_vite_hello_world/app/frontend/images/
|
58
|
-
- templates/rails_vite_hello_world/app/frontend/images/
|
59
|
-
- templates/rails_vite_hello_world/app/frontend/javascript/components/
|
57
|
+
- templates/rails_vite_hello_world/app/frontend/images/svelte-on-rails-hello-world-england.png
|
58
|
+
- templates/rails_vite_hello_world/app/frontend/images/svelte-on-rails-hello-world-face-smile-wink.svg
|
59
|
+
- templates/rails_vite_hello_world/app/frontend/images/svelte-on-rails-hello-world-switzerland.jpg
|
60
|
+
- templates/rails_vite_hello_world/app/frontend/javascript/components/JavascriptImport.svelte
|
61
|
+
- templates/rails_vite_hello_world/app/frontend/javascript/components/JpgImport.svelte
|
62
|
+
- templates/rails_vite_hello_world/app/frontend/javascript/components/ParentWithChild.svelte
|
63
|
+
- templates/rails_vite_hello_world/app/frontend/javascript/components/PngImport.svelte
|
60
64
|
- templates/rails_vite_hello_world/app/frontend/javascript/components/SvelteOnRailsHelloWorld.svelte
|
65
|
+
- templates/rails_vite_hello_world/app/frontend/javascript/components/SvgRawImport.svelte
|
61
66
|
- templates/rails_vite_hello_world/app/frontend/javascript/components/sub/NestedComponent.svelte
|
62
67
|
- templates/rails_vite_hello_world/app/frontend/javascript/nestedJavascript.js
|
63
68
|
- templates/rails_vite_hello_world/app/frontend/javascript/nestedJavascriptToggled.js
|
69
|
+
- templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/_nav.html.erb
|
70
|
+
- templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/_styles.html.erb
|
71
|
+
- templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/backend_frontend_rendered.html.erb
|
64
72
|
- templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/index.html.erb
|
65
|
-
- templates/
|
66
|
-
- templates/svelte_on_rails_vite_base/config/svelte_on_rails.yml
|
73
|
+
- templates/rails_vite_hello_world/app/views/svelte_on_rails_hello_world/ssr_auto_rendered.html.erb
|
67
74
|
homepage: https://gitlab.com/sedl/svelte-on-rails
|
68
75
|
licenses:
|
69
76
|
- MIT
|
@@ -1,123 +0,0 @@
|
|
1
|
-
#!/usr/bin/env node
|
2
|
-
|
3
|
-
import path from 'path';
|
4
|
-
import fs from 'fs/promises';
|
5
|
-
import { rawResolver, stringPlugin, ssrExternals } from "./customPlugins.js";
|
6
|
-
|
7
|
-
// Debugging: Log NODE_PATH and current working directory
|
8
|
-
console.log('NODE_PATH:', process.env.NODE_PATH);
|
9
|
-
console.log('Current Working Directory:', process.cwd());
|
10
|
-
|
11
|
-
// Arguments: inputFile, outputDir, gemPath
|
12
|
-
const args = process.argv.slice(2);
|
13
|
-
const inputFile = args[0];
|
14
|
-
const outputDir = args[1];
|
15
|
-
const gemPath = args[2];
|
16
|
-
|
17
|
-
// Pfad zu node_modules im Gem
|
18
|
-
const gemNodeModules = path.join(gemPath, 'node_modules');
|
19
|
-
// Path to node_modules in the Rails app (current working directory)
|
20
|
-
const appNodeModules = path.join(process.cwd(), 'node_modules');
|
21
|
-
|
22
|
-
// Dynamische Importe der Build-Tools aus dem Gem
|
23
|
-
const { rollup } = await import(path.join(appNodeModules, 'rollup', 'dist', 'rollup.js'));
|
24
|
-
const svelte = await import(path.join(appNodeModules, 'rollup-plugin-svelte', 'index.js')).then(m => m.default);
|
25
|
-
const resolve = await import(path.join(appNodeModules, '@rollup', 'plugin-node-resolve', 'dist', 'es', 'index.js')).then(m => m.default);
|
26
|
-
const commonjs = await import(path.join(appNodeModules, '@rollup/plugin-commonjs', 'dist', 'es', 'index.js')).then(m => m.default);
|
27
|
-
const url = await import(path.join(appNodeModules, '@rollup', 'plugin-url', 'dist', 'es', 'index.js')).then(m => m.default);
|
28
|
-
const css = await import(path.join(appNodeModules, 'rollup-plugin-css-only', 'dist', 'index.mjs')).then(m => m.default);
|
29
|
-
const { sveltePreprocess } = await import(path.join(appNodeModules, 'svelte-preprocess', 'dist', 'index.js'));
|
30
|
-
|
31
|
-
|
32
|
-
if (!inputFile || !outputDir || !gemPath) {
|
33
|
-
console.error('Error: inputFile, outputDir, and gemPath must be specified.');
|
34
|
-
console.error('Usage: node script.js <inputFile> <outputDir> <gemPath>');
|
35
|
-
process.exit(1);
|
36
|
-
}
|
37
|
-
|
38
|
-
// Ensure that gemPath exists
|
39
|
-
try {
|
40
|
-
await fs.access(gemPath);
|
41
|
-
} catch (error) {
|
42
|
-
console.error(`Error: The gemPath "${gemPath}" does not exist.`);
|
43
|
-
process.exit(1);
|
44
|
-
}
|
45
|
-
|
46
|
-
const fileName = path.basename(inputFile, '.svelte');
|
47
|
-
const outputFile = path.join(outputDir, `${fileName}.js`);
|
48
|
-
const outputCss = path.join(outputDir, `${fileName}.css`);
|
49
|
-
|
50
|
-
const rollupConfig = {
|
51
|
-
input: inputFile,
|
52
|
-
output: {
|
53
|
-
file: outputFile,
|
54
|
-
format: 'esm',
|
55
|
-
},
|
56
|
-
external: [
|
57
|
-
'fs', 'path', 'url', 'module', 'http', 'https', 'zlib', 'stream', 'buffer',
|
58
|
-
'axios', 'form-data'
|
59
|
-
],
|
60
|
-
onwarn(warning, warn) {
|
61
|
-
if (warning.code === 'CIRCULAR_DEPENDENCY') return;
|
62
|
-
if (warning.code === 'EMPTY_BUNDLE' || warning.code === 'UNUSED_EXTERNAL_IMPORT') return;
|
63
|
-
warn(warning);
|
64
|
-
},
|
65
|
-
plugins: [
|
66
|
-
svelte({
|
67
|
-
preprocess: sveltePreprocess({
|
68
|
-
pug: true,
|
69
|
-
typescript: true
|
70
|
-
}),
|
71
|
-
compilerOptions: {
|
72
|
-
generate: 'ssr',
|
73
|
-
hydratable: false
|
74
|
-
},
|
75
|
-
onwarn(warning, handler) {
|
76
|
-
if (warning.code === 'MISSING_EXPORT' && warning.exporter.includes('axios')) return;
|
77
|
-
handler(warning);
|
78
|
-
}
|
79
|
-
}),
|
80
|
-
rawResolver(),
|
81
|
-
stringPlugin(),
|
82
|
-
url({
|
83
|
-
include: ['**/*.jpg', '**/*.png', '**/*.jpeg', '**/*.gif'],
|
84
|
-
limit: 0,
|
85
|
-
destDir: outputDir,
|
86
|
-
publicPath: outputDir,
|
87
|
-
emitFiles: true,
|
88
|
-
}),
|
89
|
-
css({ output: path.basename(outputCss) }),
|
90
|
-
resolve({
|
91
|
-
dedupe: ['svelte'],
|
92
|
-
exportConditions: ['svelte', 'server'],
|
93
|
-
// modulePaths: [appNodeModules, gemNodeModules], // Prioritize app's node_modules
|
94
|
-
modulePaths: [appNodeModules], // Prioritize app's node_modules
|
95
|
-
extensions: ['.mjs', '.js', '.cjs', '.ts'],
|
96
|
-
mainFields: ['main', 'module']
|
97
|
-
}),
|
98
|
-
commonjs({
|
99
|
-
include: [/node_modules/],
|
100
|
-
transformMixedEsModules: true
|
101
|
-
}),
|
102
|
-
ssrExternals()
|
103
|
-
],
|
104
|
-
};
|
105
|
-
|
106
|
-
// Rollup build
|
107
|
-
async function compile() {
|
108
|
-
try {
|
109
|
-
const startTime = performance.now();
|
110
|
-
const bundle = await rollup(rollupConfig);
|
111
|
-
await bundle.write(rollupConfig.output);
|
112
|
-
await bundle.close();
|
113
|
-
console.log(`Build successful: ${outputFile} and ${outputCss}`);
|
114
|
-
const endTime = performance.now();
|
115
|
-
const duration = (endTime - startTime).toFixed(2);
|
116
|
-
console.log(`Execution time: ${duration} ms`);
|
117
|
-
} catch (error) {
|
118
|
-
console.error('Build failed:', error);
|
119
|
-
process.exit(1);
|
120
|
-
}
|
121
|
-
}
|
122
|
-
|
123
|
-
compile();
|
@@ -1,120 +0,0 @@
|
|
1
|
-
module SvelteOnRails
|
2
|
-
|
3
|
-
class Compiler
|
4
|
-
|
5
|
-
require 'open3'
|
6
|
-
|
7
|
-
def initialize(filename, base_path: SvelteOnRails::Configuration.instance.components_folder_full)
|
8
|
-
|
9
|
-
utils = SvelteOnRails::Lib::Utils
|
10
|
-
@files = utils.component_files(filename, base_path: base_path)
|
11
|
-
|
12
|
-
end
|
13
|
-
|
14
|
-
# compiler
|
15
|
-
def compile_if_changes
|
16
|
-
|
17
|
-
# letzte Änderung innerhalb des ordners ermitteln
|
18
|
-
|
19
|
-
watch_changes = SvelteOnRails::Configuration.instance.watch_changes?
|
20
|
-
ts_file = SvelteOnRails::Configuration.instance.dist_folder.join('reset_timestamp')
|
21
|
-
|
22
|
-
have_changes = if watch_changes && File.exist?(ts_file)
|
23
|
-
|
24
|
-
# compare last modification timestamp
|
25
|
-
last_modification = 100.years.ago.to_time
|
26
|
-
Dir.glob("#{SvelteOnRails::Configuration.instance.components_folder}**/*").each do |path|
|
27
|
-
if File.file?(path)
|
28
|
-
mtime = File.mtime(path)
|
29
|
-
if mtime > last_modification
|
30
|
-
last_modification = mtime
|
31
|
-
end
|
32
|
-
end
|
33
|
-
end
|
34
|
-
File.mtime(ts_file) < last_modification
|
35
|
-
|
36
|
-
elsif watch_changes
|
37
|
-
true
|
38
|
-
elsif !File.exist?(ts_file)
|
39
|
-
true
|
40
|
-
else
|
41
|
-
false
|
42
|
-
end
|
43
|
-
|
44
|
-
if have_changes || !File.exist?(compiled_js_file) || !File.exist?(compiled_css_file)
|
45
|
-
if have_changes || (!File.exist?(ts_file) && watch_changes)
|
46
|
-
self.class.reset_dist
|
47
|
-
end
|
48
|
-
compile
|
49
|
-
end
|
50
|
-
end
|
51
|
-
|
52
|
-
def compiled_js_file
|
53
|
-
@files[:compiled_file] + '.js'
|
54
|
-
end
|
55
|
-
|
56
|
-
def compiled_css_file
|
57
|
-
@files[:compiled_file] + '.css'
|
58
|
-
end
|
59
|
-
|
60
|
-
def compiled_file
|
61
|
-
@files[:compiled_file]
|
62
|
-
end
|
63
|
-
|
64
|
-
def compile
|
65
|
-
|
66
|
-
start_time = Time.now
|
67
|
-
|
68
|
-
cnf = SvelteOnRails::Configuration.instance
|
69
|
-
subs = @files[:svelte_filename].split('/')[0..-2].join('/')
|
70
|
-
dist = cnf.dist_folder + cnf.components_folder + subs
|
71
|
-
utils = SvelteOnRails::Lib::Utils
|
72
|
-
|
73
|
-
cmd = [
|
74
|
-
'node',
|
75
|
-
utils.gem_app_dir + 'compiler/compile.js',
|
76
|
-
@files[:svelte_file],
|
77
|
-
dist,
|
78
|
-
utils.gem_app_dir
|
79
|
-
].join(' ')
|
80
|
-
|
81
|
-
Dir.chdir(cnf.rails_root) do
|
82
|
-
env = { 'NODE_PATH' => File.join(cnf.rails_root, 'node_modules') }
|
83
|
-
|
84
|
-
stdout, stderr, status = Open3.capture3(env, cmd, chdir: cnf.rails_root)
|
85
|
-
|
86
|
-
unless status.to_s.match(/^pid [0-9]+ exit 0$/)
|
87
|
-
raise "Compiling «#{@files[:svelte_filename]}» Server-side, script compile.js, executed within Rails.root:\n\n#{cmd}\n\n++++++\n\n#{stderr}\n\n++++++\n\n"
|
88
|
-
end
|
89
|
-
end
|
90
|
-
|
91
|
-
time = Time.now - start_time
|
92
|
-
Rails.logger.info " Compiled #{@files[:svelte_filename]}.js: #{time.round(3)}ms" rescue nil
|
93
|
-
end
|
94
|
-
|
95
|
-
def self.reset_dist
|
96
|
-
unless Dir.exist?(SvelteOnRails::Configuration.instance.dist_folder)
|
97
|
-
FileUtils.mkdir_p(SvelteOnRails::Configuration.instance.dist_folder)
|
98
|
-
end
|
99
|
-
FileUtils.rm_rf Dir.glob("#{SvelteOnRails::Configuration.instance.dist_folder}/*")
|
100
|
-
FileUtils.touch SvelteOnRails::Configuration.instance.dist_folder.join('reset_timestamp')
|
101
|
-
end
|
102
|
-
|
103
|
-
def self.reset_and_compile_all
|
104
|
-
reset_dist
|
105
|
-
cnf = SvelteOnRails::Configuration.instance
|
106
|
-
frontend_folder = cnf.frontend_folder_full
|
107
|
-
files = Dir.glob(cnf.frontend_folder_full.join('**/*.svelte'))
|
108
|
-
files.each_with_index do |file, ind|
|
109
|
-
comp_name = file.to_s[(cnf.frontend_folder_full.to_s.length + 1)..-1]
|
110
|
-
|
111
|
-
n = SvelteOnRails::Compiler.new(comp_name, base_path: frontend_folder)
|
112
|
-
n.compile
|
113
|
-
|
114
|
-
puts "compiled #{ind + 1}/#{files.length}: #{comp_name}"
|
115
|
-
|
116
|
-
end
|
117
|
-
end
|
118
|
-
|
119
|
-
end
|
120
|
-
end
|