CtrlK
BlogDocsLog inGet started
Tessl Logo

tessl/npm-snowpack

A lightning-fast frontend build tool designed to leverage JavaScript's native ESM system for unbundled development with instant browser updates.

82

1.22x
Overview
Eval results
Files

task.mdevals/scenario-10/

Static Site Route Handler

Build a development server configuration that handles multiple routing scenarios for a static site with API mocking capabilities.

Requirements

Your task is to create a Snowpack configuration file that handles the following routing requirements:

  1. API Proxy Route: All requests to /api/* should be proxied to https://jsonplaceholder.typicode.com/* (where * represents the remaining path)

  2. SPA Fallback: All requests that don't match existing files and don't start with /api should fall back to /index.html to support client-side routing

  3. Static Asset Rewriting: Requests to /assets/* should be served from the /public/* directory

  4. Custom 404 Handler: Requests to paths starting with /docs/ that don't exist should be redirected to /docs/index.html

Implementation

@generates

Create a snowpack.config.js file that implements these routing rules. The configuration should work with Snowpack's development server.

API

// Export a configuration object with appropriate route settings
module.exports = {
  // Your configuration here
};

Test Cases

  • Requesting /api/users/1 proxies to https://jsonplaceholder.typicode.com/users/1 @test
  • Requesting /about (non-existent file) serves /index.html for SPA routing @test
  • Requesting /assets/logo.png serves /public/logo.png @test
  • Requesting /docs/missing-page redirects to /docs/index.html @test

Dependencies { .dependencies }

snowpack { .dependency }

Provides development server and routing capabilities.

Install with Tessl CLI

npx tessl i tessl/npm-snowpack

tile.json