Skip to content

SolidStart

Reference doc for the `sst.aws.SolidStart` component.

The SolidStart component lets you deploy a SolidStart app to AWS.

Minimal example

Deploy a SolidStart app that’s in the project root.

new sst.aws.SolidStart("MyWeb");

Change the path

Deploys the SolidStart app in the my-solid-app/ directory.

new sst.aws.SolidStart("MyWeb", {
path: "my-solid-app/"
});

Add a custom domain

Set a custom domain for your SolidStart app.

new sst.aws.SolidStart("MyWeb", {
domain: "my-app.com"
});

Redirect www to apex domain

Redirect www.my-app.com to my-app.com.

new sst.aws.SolidStart("MyWeb", {
domain: {
name: "my-app.com",
redirects: ["www.my-app.com"]
}
});

Link resources to your SolidStart app. This will grant permissions to the resources and allow you to access it in your app.

const bucket = new sst.aws.Bucket("MyBucket");
new sst.aws.SolidStart("MyWeb", {
link: [bucket]
});

You can use the SDK to access the linked resources in your SolidStart app.

src/app.tsx
import { Resource } from "sst";
console.log(Resource.MyBucket.name);

Constructor

new SolidStart(name, args?, opts?)

Parameters

Properties

nodes

Type Object

The underlying resources this component creates.

nodes.assets

Type Bucket

The Amazon S3 Bucket that stores the assets.

nodes.cdn

Type Output<Cdn>

The Amazon CloudFront CDN that serves the site.

nodes.server

Type Output<Function>

The AWS Lambda server function that renders the site.

url

Type Output<string>

The URL of the SolidStart app.

If the domain is set, this is the URL with the custom domain. Otherwise, it’s the autogenerated CloudFront URL.

The following are accessible through the SDK at runtime.

url

Type string

The URL of the SolidStart app.

If the domain is set, this is the URL with the custom domain. Otherwise, it’s the autogenerated CloudFront URL.

SolidStartArgs

assets?

Type Input<Object>

Configure how the SolidStart app assets are uploaded to S3.

By default, this is set to the following. Read more about these options below.

{
assets: {
textEncoding: "utf-8",
versionedFilesCacheHeader: "public,max-age=31536000,immutable",
nonVersionedFilesCacheHeader: "public,max-age=0,s-maxage=86400,stale-while-revalidate=8640"
}
}

assets.fileOptions?

Type Input<Object[]>

Specify the Content-Type and Cache-Control headers for specific files. This allows you to override the default behavior for specific files using glob patterns.

Apply Cache-Control and Content-Type to all zip files.

{
assets: {
fileOptions: [
{
files: "**/*.zip",
contentType: "application/zip",
cacheControl: "private,no-cache,no-store,must-revalidate"
}
]
}
}

Apply Cache-Control to all CSS and JS files except for CSS files with index- prefix in the main/ directory.

{
assets: {
fileOptions: [
{
files: ["**/*.css", "**/*.js"],
ignore: "main/index-*.css",
cacheControl: "private,no-cache,no-store,must-revalidate"
}
]
}
}
assets.fileOptions[].cacheControl?

Type string

The Cache-Control header to apply to the matched files.

assets.fileOptions[].contentType?

Type string

The Content-Type header to apply to the matched files.

assets.fileOptions[].files

Type string | string[]

A glob pattern or array of glob patterns of files to apply these options to.

assets.fileOptions[].ignore?

Type string | string[]

A glob pattern or array of glob patterns of files to exclude from the ones matched by the files glob pattern.

assets.nonVersionedFilesCacheHeader?

Type Input<string>

Default “public,max-age=0,s-maxage=86400,stale-while-revalidate=8640”

The Cache-Control header used for non-versioned files, like index.html. This is used by both CloudFront and the browser cache.

The default is set to not cache on browsers, and cache for 1 day on CloudFront.

{
assets: {
nonVersionedFilesCacheHeader: "public,max-age=0,no-cache"
}
}

assets.textEncoding?

Type Input<utf-8 | iso-8859-1 | windows-1252 | ascii | none>

Default “utf-8”

Character encoding for text based assets, like HTML, CSS, JS. This is used to set the Content-Type header when these files are served out.

If set to "none", then no charset will be returned in header.

{
assets: {
textEncoding: "iso-8859-1"
}
}

assets.versionedFilesCacheHeader?

Type Input<string>

Default “public,max-age=31536000,immutable”

The Cache-Control header used for versioned files, like main-1234.css. This is used by both CloudFront and the browser cache.

The default max-age is set to 1 year.

{
assets: {
versionedFilesCacheHeader: "public,max-age=31536000,immutable"
}
}

buildCommand?

Type Input<string>

Default “npm run build”

The command used internally to build your SolidStart app.

If you want to use a different build command.

{
buildCommand: "yarn build"
}

domain?

Type Input<string | Object>

Set a custom domain for your SolidStart app. Supports domains hosted either on Route 53 or outside AWS.

{
domain: "domain.com"
}

Specify a www. version of the custom domain.

{
domain: {
name: "domain.com",
redirects: ["www.domain.com"]
}
}

domain.aliases?

Type Input<string[]>

Alias domains that should be used. Unlike the redirect option, this keeps your visitors on this alias domain.

So if your users visit app2.domain.com, they will stay on app2.domain.com in their browser.

{
domain: {
name: "app1.domain.com",
aliases: ["app2.domain.com"]
}
}

domain.cert?

Type Input<string>

The ARN of an existing certificate in the us-east-1 region in AWS Certificate Manager to use for the domain. By default, SST will create a certificate with the domain name. The certificate will be created in the us-east-1(N. Virginia) region as required by AWS CloudFront.

{
domain: {
name: "domain.com",
cert: "arn:aws:acm:us-east-1:112233445566:certificate/3a958790-8878-4cdc-a396-06d95064cf63"
}
}

domain.dns?

Type Input<false | sst.aws.dns | sst.cloudflare.dns | sst.vercel.dns>

Default sst.aws.dns

The DNS adapter you want to use for managing DNS records.

Specify the hosted zone ID for the domain.

{
domain: {
name: "domain.com",
dns: sst.aws.dns({
zone: "Z2FDTNDATAQYW2"
})
}
}

Domain is hosted on Cloudflare.

{
domain: {
name: "domain.com",
dns: sst.cloudflare.dns()
}
}

domain.name

Type Input<string>

The custom domain you want to use. Supports domains hosted on Route 53 or outside AWS.

{
domain: "domain.com"
}

domain.redirects?

Type Input<string[]>

Alternate domains to be used. Visitors to the alternate domains will be redirected to the main name.

Use this to create a www. version of your domain and redirect visitors to the apex domain.

{
domain: {
name: "domain.com",
redirects: ["www.domain.com"]
}
}

environment?

Type Input<Record<string, Input<string>>>

Set in your SolidStart app. These are made available:

  1. In vinxi build, they are loaded into process.env.
  2. Locally while running sst dev vinxi dev.
{
environment: {
API_URL: api.url,
STRIPE_PUBLISHABLE_KEY: "pk_test_123"
}
}

invalidation?

Type Input<false | Object>

Default {paths: “all”, wait: false}

Configure how the CloudFront cache invalidations are handled. This is run after your SolidStart app has been deployed.

Wait for all paths to be invalidated.

{
invalidation: {
paths: "all",
wait: true
}
}

invalidation.paths?

Type Input<string[] | all | versioned>

Default “all”

The paths to invalidate.

You can either pass in an array of glob patterns to invalidate specific files. Or you can use one of these built-in options:

  • all: All files will be invalidated when any file changes
  • versioned: Only versioned files will be invalidated when versioned files change

Invalidate the index.html and all files under the products/ route. This counts as two invalidations.

{
invalidation: {
paths: ["/index.html", "/products/*"]
}
}

invalidation.wait?

Type Input<boolean>

Default false

Configure if sst deploy should wait for the CloudFront cache invalidation to finish.

Waiting for this process to finish ensures that new content will be available after the deploy finishes. However, this process can sometimes take more than 5 mins.

{
invalidation: {
wait: true
}
}

Type Input<any[]>

Link resources to your SolidStart app. This will:

  1. Grant the permissions needed to access the resources.
  2. Allow you to access it in your site using the SDK.

Takes a list of resources to link to the function.

{
link: [bucket, stripeKey]
}

path?

Type Input<string>

Default ”.”

Path to the directory where your SolidStart app is located. This path is relative to your sst.config.ts.

By default it assumes your SolidStart app is in the root of your SST app.

If your SolidStart app is in a package in your monorepo.

{
path: "packages/web"
}

permissions?

Type Input<Object[]>

Permissions and the resources that the server function in your SolidStart app needs to access. These permissions are used to create the function’s IAM role.

Allow reading and writing to an S3 bucket called my-bucket.

{
permissions: [
{
actions: ["s3:GetObject", "s3:PutObject"],
resources: ["arn:aws:s3:::my-bucket/*"]
},
]
}

Perform all actions on an S3 bucket called my-bucket.

{
permissions: [
{
actions: ["s3:*"],
resources: ["arn:aws:s3:::my-bucket/*"]
},
]
}

Grant permissions to access all resources.

{
permissions: [
{
actions: ["*"],
resources: ["*"]
},
]
}

permissions[].actions

Type string[]

The IAM actions that can be performed.

{
permissions: [
{
actions: ["s3:*"]
}
]
}

permissions[].resources

Type Input<string>[]

The resourcess specified using the IAM ARN format.

{
permissions: [
{
resources: ["arn:aws:s3:::my-bucket/*"]
}
]
}

transform?

Type Object

Transform how this component creates its underlying resources.

transform.assets?

Type BucketArgs | (args: BucketArgs => BucketArgs | void)

Transform the Bucket resource used for uploading the assets.

transform.cdn?

Type CdnArgs | (args: CdnArgs => CdnArgs | void)

Transform the CloudFront CDN resource.

transform.server?

Type FunctionArgs | (args: FunctionArgs => FunctionArgs | void)

Transform the server Function resource.

warm?

Type Input<number>

Default 0

The number of instances of the server function to keep warm. This is useful for cases where you are experiencing long cold starts. The default is to not keep any instances warm.

This works by starting a serverless cron job to make n concurrent requests to the server function every few minutes. Where n is the number of instances to keep warm.