Security News
The Dark Side of Open Source
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
sveltekit-adapter-html-like
Advanced tools
Readme
Warning
SvelteKit is still under heavy development and introduces breaking changes every now and then. If this adapter doesn't work in your setup, make sure to use
@svelte/kit@1.0.0-next.428
.
Adapter for SvelteKit apps that prerenders your site as static files for template engines such as PHP, Blade, Embedded Ruby (ERB), Handlebars, EJS etc.
This package is a fork of @sveltejs/adapter-static that adds a couple of extra features:
Install with npm i -D sveltekit-adapter-html-like
, then add the adapter to your svelte.config.js
:
// svelte.config.js
import adapter from 'sveltekit-adapter-html-like';
export default {
kit: {
adapter: adapter()
}
};
Unless you're in SPA mode, the adapter will attempt to prerender every page of your app, regardless of whether the prerender
option is set.
Type: string
Default: build
The directory to write prerendered pages to. It defaults to build
.
Type: string
Default: build
The directory to write static assets (the contents of static
, plus client-side JS and CSS generated by SvelteKit) to. Ordinarily this should be the same as pages
, and it will default to whatever the value of pages
is, but in rare circumstances you might need to output pages and assets to separate locations.
Type: string
Default: null
Specify a fallback page for SPA mode, e.g. index.html
or 200.html
or 404.html
.
Type: boolean
Default: false
If true
, precompresses files with brotli and gzip. This will generate .br
and .gz
files.
Type: object
Default: {}
Allows the injection of markup, valid HTML or otherwise, into the <head>
or <body>
. You can use the same positions as insertAdjacentHTML
:
beforebegin
afterbegin
beforeend
afterend
Example
Let's inject some WordPress tags into the page
adapter({
injectTo: {
head: {
beforeend: ['<?php wp_head(); ?>']
},
body: {
beforeend: ['<?php wp_footer(); ?>']
}
},
targetExtension: '.php'
});
Type: array
Default: []
String replacements run on every page
Example
Once again, a WordPress example
adapter({
replace: [
{
from: '<html lang="en">',
to: '<html <?php language_attributes(); ?>>'
// many: true (optional)
}
],
targetExtension: '.php'
});
Type: boolean
Default: false
Enable minification of output files
Type: string
Default: .html
Modifies the extension of the target file, e.g. .php
or .hbs
You can use sveltekit-adapter-html-like
to create a single-page app or SPA by specifying a fallback page.
In most situations this is not recommended: it harms SEO, tends to slow down perceived performance, and makes your app inaccessible to users if JavaScript fails or is disabled (which happens more often than you probably think).
The fallback page is a blank HTML page that loads your SvelteKit app and navigates to the correct route. For example Surge, a static web host, lets you add a 200.html
file that will handle any requests that don't otherwise match. We can create that file like so:
// svelte.config.js
import adapter from 'sveltekit-adapter-html-like';
export default {
kit: {
adapter: adapter({
fallback: '200.html'
})
}
};
When operating in SPA mode, only pages that have the prerender
option set will be prerendered.
This work is licensed under The MIT License
FAQs
SvelteKit adapter for HTML-like template engines such as PHP, Blade, Handlebars, etc.
The npm package sveltekit-adapter-html-like receives a total of 25 weekly downloads. As such, sveltekit-adapter-html-like popularity was classified as not popular.
We found that sveltekit-adapter-html-like demonstrated a healthy version release cadence and project activity because the last version was released less than a year ago. It has 1 open source maintainer collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Security News
At Node Congress, Socket CEO Feross Aboukhadijeh uncovers the darker aspects of open source, where applications that rely heavily on third-party dependencies can be exploited in supply chain attacks.
Research
Security News
The Socket Research team found this npm package includes code for collecting sensitive developer information, including your operating system username, Git username, and Git email.
Security News
OpenJS is warning of social engineering takeovers targeting open source projects after receiving a credible attempt on the foundation.