How to make Svelte and Spring Boot friends

So, we have a Svelte template project, consisting of 4 directories:

node_modules – NodeJS libraries on which the framework is built;

scripts – contains some additional settings, in our case it is TypeScript: if you are not going to write on TS, then you can delete this folder;

src – “source code” of the subapplication: here in the future it is necessary to place svelte components;

public is the directory where Svelte compiled resources fall by default. The index.html file is also located here. All public content is placed in the resources/static directory of the Spring Boot application. After that, the public directory is no longer needed.

It is possible to remove the README and .gitignore files (in this case the .gitignore from the root of the Spring Boot project will be used)

The project now looks like this:

Next, you need to specify the Svelte compilation path. Open the rollup.config.js file, find the only export default there and change the standard path in output to the path to the static directory in the Spring Boot application:

// ...
export default {
	input: 'src/main.js',
	output: {
		sourcemap: true,
		format: 'iife',
		name: 'app',
		file: '../src/main/resources/static/build/bundle.js' // was 'public/build/bundle.js'
	},
  // ...

Now if you run the command npm run buildthen the compiled resources will fit in resources/static, thus the Spring Boot view layer will always have access to them.

Similar Posts

Leave a Reply

Your email address will not be published. Required fields are marked *