├── .gitignore ├── Cargo.toml ├── LICENSE ├── README.md ├── cargo-generate.toml ├── end2end ├── .gitignore ├── package-lock.json ├── package.json ├── playwright.config.ts ├── tests │ └── example.spec.ts └── tsconfig.json ├── public └── favicon.ico ├── rust-toolchain.toml ├── src ├── app.rs ├── lib.rs └── main.rs └── style └── main.scss /.gitignore: -------------------------------------------------------------------------------- 1 | # Generated by Cargo 2 | # will have compiled files and executables 3 | debug/ 4 | target/ 5 | 6 | # Remove Cargo.lock from gitignore if creating an executable, leave it for libraries 7 | # More information here https://doc.rust-lang.org/cargo/guide/cargo-toml-vs-cargo-lock.html 8 | Cargo.lock 9 | 10 | # These are backup files generated by rustfmt 11 | **/*.rs.bk 12 | 13 | # MSVC Windows builds of rustc generate these, which store debugging information 14 | *.pdb 15 | -------------------------------------------------------------------------------- /Cargo.toml: -------------------------------------------------------------------------------- 1 | [package] 2 | name = "{{project-name}}" 3 | version = "0.1.0" 4 | edition = "2021" 5 | 6 | [lib] 7 | crate-type = ["cdylib", "rlib"] 8 | 9 | [dependencies] 10 | leptos = { version = "0.8.0"{% if nightly == "Yes" %}, features = ["nightly"]{% endif %} } 11 | leptos_router = { version = "0.8.0"{% if nightly == "Yes" %}, features = ["nightly"]{% endif %} } 12 | axum = { version = "0.8.0", optional = true } 13 | console_error_panic_hook = { version = "0.1", optional = true } 14 | leptos_axum = { version = "0.8.0", optional = true } 15 | leptos_meta = { version = "0.8.0" } 16 | tokio = { version = "1", features = ["rt-multi-thread"], optional = true } 17 | wasm-bindgen = { version = "=0.2.100", optional = true } 18 | 19 | [features] 20 | hydrate = [ 21 | "leptos/hydrate", 22 | "dep:console_error_panic_hook", 23 | "dep:wasm-bindgen", 24 | ] 25 | ssr = [ 26 | "dep:axum", 27 | "dep:tokio", 28 | "dep:leptos_axum", 29 | "leptos/ssr", 30 | "leptos_meta/ssr", 31 | "leptos_router/ssr", 32 | ] 33 | 34 | # Defines a size-optimized profile for the WASM bundle in release mode 35 | [profile.wasm-release] 36 | inherits = "release" 37 | opt-level = 'z' 38 | lto = true 39 | codegen-units = 1 40 | panic = "abort" 41 | 42 | [package.metadata.leptos] 43 | # The name used by wasm-bindgen/cargo-leptos for the JS/WASM bundle. Defaults to the crate name 44 | output-name = "{{project-name}}" 45 | 46 | # The site root folder is where cargo-leptos generate all output. WARNING: all content of this folder will be erased on a rebuild. Use it in your server setup. 47 | site-root = "target/site" 48 | 49 | # The site-root relative folder where all compiled output (JS, WASM and CSS) is written 50 | # Defaults to pkg 51 | site-pkg-dir = "pkg" 52 | 53 | # [Optional] The source CSS file. If it ends with .sass or .scss then it will be compiled by dart-sass into CSS. The CSS is optimized by Lightning CSS before being written to //app.css 54 | style-file = "style/main.scss" 55 | # Assets source dir. All files found here will be copied and synchronized to site-root. 56 | # The assets-dir cannot have a sub directory with the same name/path as site-pkg-dir. 57 | # 58 | # Optional. Env: LEPTOS_ASSETS_DIR. 59 | assets-dir = "public" 60 | 61 | # The IP and port (ex: 127.0.0.1:3000) where the server serves the content. Use it in your server setup. 62 | site-addr = "127.0.0.1:3000" 63 | 64 | # The port to use for automatic reload monitoring 65 | reload-port = 3001 66 | 67 | # [Optional] Command to use when running end2end tests. It will run in the end2end dir. 68 | # [Windows] for non-WSL use "npx.cmd playwright test" 69 | # This binary name can be checked in Powershell with Get-Command npx 70 | end2end-cmd = "npx playwright test" 71 | end2end-dir = "end2end" 72 | 73 | # The browserlist query used for optimizing the CSS. 74 | browserquery = "defaults" 75 | 76 | # The environment Leptos will run in, usually either "DEV" or "PROD" 77 | env = "DEV" 78 | 79 | # The features to use when compiling the bin target 80 | # 81 | # Optional. Can be over-ridden with the command line parameter --bin-features 82 | bin-features = ["ssr"] 83 | 84 | # If the --no-default-features flag should be used when compiling the bin target 85 | # 86 | # Optional. Defaults to false. 87 | bin-default-features = false 88 | 89 | # The features to use when compiling the lib target 90 | # 91 | # Optional. Can be over-ridden with the command line parameter --lib-features 92 | lib-features = ["hydrate"] 93 | 94 | # If the --no-default-features flag should be used when compiling the lib target 95 | # 96 | # Optional. Defaults to false. 97 | lib-default-features = false 98 | 99 | # The profile to use for the lib target when compiling for release 100 | # 101 | # Optional. Defaults to "release". 102 | lib-profile-release = "wasm-release" 103 | -------------------------------------------------------------------------------- /LICENSE: -------------------------------------------------------------------------------- 1 | This is free and unencumbered software released into the public domain. 2 | 3 | Anyone is free to copy, modify, publish, use, compile, sell, or 4 | distribute this software, either in source code form or as a compiled 5 | binary, for any purpose, commercial or non-commercial, and by any 6 | means. 7 | 8 | In jurisdictions that recognize copyright laws, the author or authors 9 | of this software dedicate any and all copyright interest in the 10 | software to the public domain. We make this dedication for the benefit 11 | of the public at large and to the detriment of our heirs and 12 | successors. We intend this dedication to be an overt act of 13 | relinquishment in perpetuity of all present and future rights to this 14 | software under copyright law. 15 | 16 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, 17 | EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF 18 | MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. 19 | IN NO EVENT SHALL THE AUTHORS BE LIABLE FOR ANY CLAIM, DAMAGES OR 20 | OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, 21 | ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR 22 | OTHER DEALINGS IN THE SOFTWARE. 23 | 24 | For more information, please refer to 25 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | 2 | 3 | Leptos Logo 4 | 5 | 6 | # Leptos Axum Starter Template 7 | 8 | This is a template for use with the [Leptos](https://github.com/leptos-rs/leptos) web framework and the [cargo-leptos](https://github.com/akesson/cargo-leptos) tool using [Axum](https://github.com/tokio-rs/axum). 9 | 10 | ## Creating your template repo 11 | 12 | If you don't have `cargo-leptos` installed you can install it with 13 | 14 | ```bash 15 | cargo install cargo-leptos --locked 16 | ``` 17 | 18 | Then run 19 | ```bash 20 | cargo leptos new --git https://github.com/leptos-rs/start-axum 21 | ``` 22 | 23 | to generate a new project template. 24 | 25 | ```bash 26 | cd {{project-name}} 27 | ``` 28 | 29 | to go to your newly created project. 30 | Feel free to explore the project structure, but the best place to start with your application code is in `src/app.rs`. 31 | Addtionally, Cargo.toml may need updating as new versions of the dependencies are released, especially if things are not working after a `cargo update`. 32 | 33 | ## Running your project 34 | 35 | ```bash 36 | cargo leptos watch 37 | ``` 38 | 39 | ## Installing Additional Tools 40 | 41 | By default, `cargo-leptos` uses `nightly` Rust, `cargo-generate`, and `sass`. If you run into any trouble, you may need to install one or more of these tools. 42 | 43 | 1. `rustup toolchain install nightly --allow-downgrade` - make sure you have Rust nightly 44 | 2. `rustup target add wasm32-unknown-unknown` - add the ability to compile Rust to WebAssembly 45 | 3. `cargo install cargo-generate` - install `cargo-generate` binary (should be installed automatically in future) 46 | 4. `npm install -g sass` - install `dart-sass` (should be optional in future 47 | 5. Run `npm install` in end2end subdirectory before test 48 | 49 | ## Compiling for Release 50 | ```bash 51 | cargo leptos build --release 52 | ``` 53 | 54 | Will generate your server binary in target/server/release and your site package in target/site 55 | 56 | ## Testing Your Project 57 | ```bash 58 | cargo leptos end-to-end 59 | ``` 60 | 61 | ```bash 62 | cargo leptos end-to-end --release 63 | ``` 64 | 65 | Cargo-leptos uses Playwright as the end-to-end test tool. 66 | Tests are located in end2end/tests directory. 67 | 68 | ## Executing a Server on a Remote Machine Without the Toolchain 69 | After running a `cargo leptos build --release` the minimum files needed are: 70 | 71 | 1. The server binary located in `target/server/release` 72 | 2. The `site` directory and all files within located in `target/site` 73 | 74 | Copy these files to your remote server. The directory structure should be: 75 | ```text 76 | {{project-name}} 77 | site/ 78 | ``` 79 | Set the following environment variables (updating for your project as needed): 80 | ```sh 81 | export LEPTOS_OUTPUT_NAME="{{project-name}}" 82 | export LEPTOS_SITE_ROOT="site" 83 | export LEPTOS_SITE_PKG_DIR="pkg" 84 | export LEPTOS_SITE_ADDR="127.0.0.1:3000" 85 | export LEPTOS_RELOAD_PORT="3001" 86 | ``` 87 | Finally, run the server binary. 88 | 89 | ## Licensing 90 | 91 | This template itself is released under the Unlicense. You should replace the LICENSE for your own application with an appropriate license if you plan to release it publicly. 92 | -------------------------------------------------------------------------------- /cargo-generate.toml: -------------------------------------------------------------------------------- 1 | [placeholders] 2 | nightly = { prompt = "Use nightly features?", choices = ["No", "Yes"], default = "No", type = "string"} 3 | 4 | [conditional.'nightly == "No"'] 5 | ignore = ["rust-toolchain.toml"] 6 | 7 | [template] 8 | exclude = ["public/*"] 9 | -------------------------------------------------------------------------------- /end2end/.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | playwright-report 3 | test-results 4 | -------------------------------------------------------------------------------- /end2end/package-lock.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "end2end", 3 | "version": "1.0.0", 4 | "lockfileVersion": 2, 5 | "requires": true, 6 | "packages": { 7 | "": { 8 | "name": "end2end", 9 | "version": "1.0.0", 10 | "license": "ISC", 11 | "devDependencies": { 12 | "@playwright/test": "^1.44.1", 13 | "@types/node": "^20.12.12", 14 | "typescript": "^5.4.5" 15 | } 16 | }, 17 | "node_modules/@playwright/test": { 18 | "version": "1.44.1", 19 | "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.44.1.tgz", 20 | "integrity": "sha512-1hZ4TNvD5z9VuhNJ/walIjvMVvYkZKf71axoF/uiAqpntQJXpG64dlXhoDXE3OczPuTuvjf/M5KWFg5VAVUS3Q==", 21 | "dev": true, 22 | "license": "Apache-2.0", 23 | "dependencies": { 24 | "playwright": "1.44.1" 25 | }, 26 | "bin": { 27 | "playwright": "cli.js" 28 | }, 29 | "engines": { 30 | "node": ">=16" 31 | } 32 | }, 33 | "node_modules/@types/node": { 34 | "version": "20.12.12", 35 | "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.12.tgz", 36 | "integrity": "sha512-eWLDGF/FOSPtAvEqeRAQ4C8LSA7M1I7i0ky1I8U7kD1J5ITyW3AsRhQrKVoWf5pFKZ2kILsEGJhsI9r93PYnOw==", 37 | "dev": true, 38 | "license": "MIT", 39 | "dependencies": { 40 | "undici-types": "~5.26.4" 41 | } 42 | }, 43 | "node_modules/fsevents": { 44 | "version": "2.3.2", 45 | "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", 46 | "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", 47 | "dev": true, 48 | "hasInstallScript": true, 49 | "license": "MIT", 50 | "optional": true, 51 | "os": [ 52 | "darwin" 53 | ], 54 | "engines": { 55 | "node": "^8.16.0 || ^10.6.0 || >=11.0.0" 56 | } 57 | }, 58 | "node_modules/playwright": { 59 | "version": "1.44.1", 60 | "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.44.1.tgz", 61 | "integrity": "sha512-qr/0UJ5CFAtloI3avF95Y0L1xQo6r3LQArLIg/z/PoGJ6xa+EwzrwO5lpNr/09STxdHuUoP2mvuELJS+hLdtgg==", 62 | "dev": true, 63 | "license": "Apache-2.0", 64 | "dependencies": { 65 | "playwright-core": "1.44.1" 66 | }, 67 | "bin": { 68 | "playwright": "cli.js" 69 | }, 70 | "engines": { 71 | "node": ">=16" 72 | }, 73 | "optionalDependencies": { 74 | "fsevents": "2.3.2" 75 | } 76 | }, 77 | "node_modules/playwright-core": { 78 | "version": "1.44.1", 79 | "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.44.1.tgz", 80 | "integrity": "sha512-wh0JWtYTrhv1+OSsLPgFzGzt67Y7BE/ZS3jEqgGBlp2ppp1ZDj8c+9IARNW4dwf1poq5MgHreEM2KV/GuR4cFA==", 81 | "dev": true, 82 | "license": "Apache-2.0", 83 | "bin": { 84 | "playwright-core": "cli.js" 85 | }, 86 | "engines": { 87 | "node": ">=16" 88 | } 89 | }, 90 | "node_modules/typescript": { 91 | "version": "5.4.5", 92 | "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz", 93 | "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==", 94 | "dev": true, 95 | "license": "Apache-2.0", 96 | "bin": { 97 | "tsc": "bin/tsc", 98 | "tsserver": "bin/tsserver" 99 | }, 100 | "engines": { 101 | "node": ">=14.17" 102 | } 103 | }, 104 | "node_modules/undici-types": { 105 | "version": "5.26.5", 106 | "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", 107 | "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==", 108 | "dev": true, 109 | "license": "MIT" 110 | } 111 | }, 112 | "dependencies": { 113 | "@playwright/test": { 114 | "version": "1.44.1", 115 | "resolved": "https://registry.npmjs.org/@playwright/test/-/test-1.44.1.tgz", 116 | "integrity": "sha512-1hZ4TNvD5z9VuhNJ/walIjvMVvYkZKf71axoF/uiAqpntQJXpG64dlXhoDXE3OczPuTuvjf/M5KWFg5VAVUS3Q==", 117 | "dev": true, 118 | "requires": { 119 | "playwright": "1.44.1" 120 | } 121 | }, 122 | "@types/node": { 123 | "version": "20.12.12", 124 | "resolved": "https://registry.npmjs.org/@types/node/-/node-20.12.12.tgz", 125 | "integrity": "sha512-eWLDGF/FOSPtAvEqeRAQ4C8LSA7M1I7i0ky1I8U7kD1J5ITyW3AsRhQrKVoWf5pFKZ2kILsEGJhsI9r93PYnOw==", 126 | "dev": true, 127 | "requires": { 128 | "undici-types": "~5.26.4" 129 | } 130 | }, 131 | "fsevents": { 132 | "version": "2.3.2", 133 | "resolved": "https://registry.npmjs.org/fsevents/-/fsevents-2.3.2.tgz", 134 | "integrity": "sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==", 135 | "dev": true, 136 | "optional": true 137 | }, 138 | "playwright": { 139 | "version": "1.44.1", 140 | "resolved": "https://registry.npmjs.org/playwright/-/playwright-1.44.1.tgz", 141 | "integrity": "sha512-qr/0UJ5CFAtloI3avF95Y0L1xQo6r3LQArLIg/z/PoGJ6xa+EwzrwO5lpNr/09STxdHuUoP2mvuELJS+hLdtgg==", 142 | "dev": true, 143 | "requires": { 144 | "fsevents": "2.3.2", 145 | "playwright-core": "1.44.1" 146 | } 147 | }, 148 | "playwright-core": { 149 | "version": "1.44.1", 150 | "resolved": "https://registry.npmjs.org/playwright-core/-/playwright-core-1.44.1.tgz", 151 | "integrity": "sha512-wh0JWtYTrhv1+OSsLPgFzGzt67Y7BE/ZS3jEqgGBlp2ppp1ZDj8c+9IARNW4dwf1poq5MgHreEM2KV/GuR4cFA==", 152 | "dev": true 153 | }, 154 | "typescript": { 155 | "version": "5.4.5", 156 | "resolved": "https://registry.npmjs.org/typescript/-/typescript-5.4.5.tgz", 157 | "integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==", 158 | "dev": true 159 | }, 160 | "undici-types": { 161 | "version": "5.26.5", 162 | "resolved": "https://registry.npmjs.org/undici-types/-/undici-types-5.26.5.tgz", 163 | "integrity": "sha512-JlCMO+ehdEIKqlFxk6IfVoAUVmgz7cU7zD/h9XZ0qzeosSHmUJVOzSQvvYSYWXkFXC+IfLKSIffhv0sVZup6pA==", 164 | "dev": true 165 | } 166 | } 167 | } 168 | -------------------------------------------------------------------------------- /end2end/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "end2end", 3 | "version": "1.0.0", 4 | "description": "", 5 | "main": "index.js", 6 | "scripts": {}, 7 | "keywords": [], 8 | "author": "", 9 | "license": "ISC", 10 | "devDependencies": { 11 | "@playwright/test": "^1.44.1", 12 | "@types/node": "^20.12.12", 13 | "typescript": "^5.4.5" 14 | } 15 | } 16 | -------------------------------------------------------------------------------- /end2end/playwright.config.ts: -------------------------------------------------------------------------------- 1 | import type { PlaywrightTestConfig } from "@playwright/test"; 2 | import { devices, defineConfig } from "@playwright/test"; 3 | 4 | /** 5 | * Read environment variables from file. 6 | * https://github.com/motdotla/dotenv 7 | */ 8 | // require('dotenv').config(); 9 | 10 | /** 11 | * See https://playwright.dev/docs/test-configuration. 12 | */ 13 | export default defineConfig({ 14 | testDir: "./tests", 15 | /* Maximum time one test can run for. */ 16 | timeout: 30 * 1000, 17 | expect: { 18 | /** 19 | * Maximum time expect() should wait for the condition to be met. 20 | * For example in `await expect(locator).toHaveText();` 21 | */ 22 | timeout: 5000, 23 | }, 24 | /* Run tests in files in parallel */ 25 | fullyParallel: true, 26 | /* Fail the build on CI if you accidentally left test.only in the source code. */ 27 | forbidOnly: !!process.env.CI, 28 | /* Retry on CI only */ 29 | retries: process.env.CI ? 2 : 0, 30 | /* Opt out of parallel tests on CI. */ 31 | workers: process.env.CI ? 1 : undefined, 32 | /* Reporter to use. See https://playwright.dev/docs/test-reporters */ 33 | reporter: "html", 34 | /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */ 35 | use: { 36 | /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */ 37 | actionTimeout: 0, 38 | /* Base URL to use in actions like `await page.goto('/')`. */ 39 | // baseURL: 'http://localhost:3000', 40 | 41 | /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */ 42 | trace: "on-first-retry", 43 | }, 44 | 45 | /* Configure projects for major browsers */ 46 | projects: [ 47 | { 48 | name: "chromium", 49 | use: { 50 | ...devices["Desktop Chrome"], 51 | }, 52 | }, 53 | 54 | { 55 | name: "firefox", 56 | use: { 57 | ...devices["Desktop Firefox"], 58 | }, 59 | }, 60 | 61 | { 62 | name: "webkit", 63 | use: { 64 | ...devices["Desktop Safari"], 65 | }, 66 | }, 67 | 68 | /* Test against mobile viewports. */ 69 | // { 70 | // name: 'Mobile Chrome', 71 | // use: { 72 | // ...devices['Pixel 5'], 73 | // }, 74 | // }, 75 | // { 76 | // name: 'Mobile Safari', 77 | // use: { 78 | // ...devices['iPhone 12'], 79 | // }, 80 | // }, 81 | 82 | /* Test against branded browsers. */ 83 | // { 84 | // name: 'Microsoft Edge', 85 | // use: { 86 | // channel: 'msedge', 87 | // }, 88 | // }, 89 | // { 90 | // name: 'Google Chrome', 91 | // use: { 92 | // channel: 'chrome', 93 | // }, 94 | // }, 95 | ], 96 | 97 | /* Folder for test artifacts such as screenshots, videos, traces, etc. */ 98 | // outputDir: 'test-results/', 99 | 100 | /* Run your local dev server before starting the tests */ 101 | // webServer: { 102 | // command: 'npm run start', 103 | // port: 3000, 104 | // }, 105 | }); 106 | -------------------------------------------------------------------------------- /end2end/tests/example.spec.ts: -------------------------------------------------------------------------------- 1 | import { test, expect } from "@playwright/test"; 2 | 3 | test("homepage has title and heading text", async ({ page }) => { 4 | await page.goto("http://localhost:3000/"); 5 | 6 | await expect(page).toHaveTitle("Welcome to Leptos"); 7 | 8 | await expect(page.locator("h1")).toHaveText("Welcome to Leptos!"); 9 | }); 10 | -------------------------------------------------------------------------------- /end2end/tsconfig.json: -------------------------------------------------------------------------------- 1 | { 2 | "compilerOptions": { 3 | /* Visit https://aka.ms/tsconfig to read more about this file */ 4 | 5 | /* Projects */ 6 | // "incremental": true, /* Save .tsbuildinfo files to allow for incremental compilation of projects. */ 7 | // "composite": true, /* Enable constraints that allow a TypeScript project to be used with project references. */ 8 | // "tsBuildInfoFile": "./.tsbuildinfo", /* Specify the path to .tsbuildinfo incremental compilation file. */ 9 | // "disableSourceOfProjectReferenceRedirect": true, /* Disable preferring source files instead of declaration files when referencing composite projects. */ 10 | // "disableSolutionSearching": true, /* Opt a project out of multi-project reference checking when editing. */ 11 | // "disableReferencedProjectLoad": true, /* Reduce the number of projects loaded automatically by TypeScript. */ 12 | 13 | /* Language and Environment */ 14 | "target": "es2016", /* Set the JavaScript language version for emitted JavaScript and include compatible library declarations. */ 15 | // "lib": [], /* Specify a set of bundled library declaration files that describe the target runtime environment. */ 16 | // "jsx": "preserve", /* Specify what JSX code is generated. */ 17 | // "experimentalDecorators": true, /* Enable experimental support for legacy experimental decorators. */ 18 | // "emitDecoratorMetadata": true, /* Emit design-type metadata for decorated declarations in source files. */ 19 | // "jsxFactory": "", /* Specify the JSX factory function used when targeting React JSX emit, e.g. 'React.createElement' or 'h'. */ 20 | // "jsxFragmentFactory": "", /* Specify the JSX Fragment reference used for fragments when targeting React JSX emit e.g. 'React.Fragment' or 'Fragment'. */ 21 | // "jsxImportSource": "", /* Specify module specifier used to import the JSX factory functions when using 'jsx: react-jsx*'. */ 22 | // "reactNamespace": "", /* Specify the object invoked for 'createElement'. This only applies when targeting 'react' JSX emit. */ 23 | // "noLib": true, /* Disable including any library files, including the default lib.d.ts. */ 24 | // "useDefineForClassFields": true, /* Emit ECMAScript-standard-compliant class fields. */ 25 | // "moduleDetection": "auto", /* Control what method is used to detect module-format JS files. */ 26 | 27 | /* Modules */ 28 | "module": "commonjs", /* Specify what module code is generated. */ 29 | // "rootDir": "./", /* Specify the root folder within your source files. */ 30 | // "moduleResolution": "node10", /* Specify how TypeScript looks up a file from a given module specifier. */ 31 | // "baseUrl": "./", /* Specify the base directory to resolve non-relative module names. */ 32 | // "paths": {}, /* Specify a set of entries that re-map imports to additional lookup locations. */ 33 | // "rootDirs": [], /* Allow multiple folders to be treated as one when resolving modules. */ 34 | // "typeRoots": [], /* Specify multiple folders that act like './node_modules/@types'. */ 35 | // "types": [], /* Specify type package names to be included without being referenced in a source file. */ 36 | // "allowUmdGlobalAccess": true, /* Allow accessing UMD globals from modules. */ 37 | // "moduleSuffixes": [], /* List of file name suffixes to search when resolving a module. */ 38 | // "allowImportingTsExtensions": true, /* Allow imports to include TypeScript file extensions. Requires '--moduleResolution bundler' and either '--noEmit' or '--emitDeclarationOnly' to be set. */ 39 | // "resolvePackageJsonExports": true, /* Use the package.json 'exports' field when resolving package imports. */ 40 | // "resolvePackageJsonImports": true, /* Use the package.json 'imports' field when resolving imports. */ 41 | // "customConditions": [], /* Conditions to set in addition to the resolver-specific defaults when resolving imports. */ 42 | // "resolveJsonModule": true, /* Enable importing .json files. */ 43 | // "allowArbitraryExtensions": true, /* Enable importing files with any extension, provided a declaration file is present. */ 44 | // "noResolve": true, /* Disallow 'import's, 'require's or ''s from expanding the number of files TypeScript should add to a project. */ 45 | 46 | /* JavaScript Support */ 47 | // "allowJs": true, /* Allow JavaScript files to be a part of your program. Use the 'checkJS' option to get errors from these files. */ 48 | // "checkJs": true, /* Enable error reporting in type-checked JavaScript files. */ 49 | // "maxNodeModuleJsDepth": 1, /* Specify the maximum folder depth used for checking JavaScript files from 'node_modules'. Only applicable with 'allowJs'. */ 50 | 51 | /* Emit */ 52 | // "declaration": true, /* Generate .d.ts files from TypeScript and JavaScript files in your project. */ 53 | // "declarationMap": true, /* Create sourcemaps for d.ts files. */ 54 | // "emitDeclarationOnly": true, /* Only output d.ts files and not JavaScript files. */ 55 | // "sourceMap": true, /* Create source map files for emitted JavaScript files. */ 56 | // "inlineSourceMap": true, /* Include sourcemap files inside the emitted JavaScript. */ 57 | // "outFile": "./", /* Specify a file that bundles all outputs into one JavaScript file. If 'declaration' is true, also designates a file that bundles all .d.ts output. */ 58 | // "outDir": "./", /* Specify an output folder for all emitted files. */ 59 | // "removeComments": true, /* Disable emitting comments. */ 60 | // "noEmit": true, /* Disable emitting files from a compilation. */ 61 | // "importHelpers": true, /* Allow importing helper functions from tslib once per project, instead of including them per-file. */ 62 | // "importsNotUsedAsValues": "remove", /* Specify emit/checking behavior for imports that are only used for types. */ 63 | // "downlevelIteration": true, /* Emit more compliant, but verbose and less performant JavaScript for iteration. */ 64 | // "sourceRoot": "", /* Specify the root path for debuggers to find the reference source code. */ 65 | // "mapRoot": "", /* Specify the location where debugger should locate map files instead of generated locations. */ 66 | // "inlineSources": true, /* Include source code in the sourcemaps inside the emitted JavaScript. */ 67 | // "emitBOM": true, /* Emit a UTF-8 Byte Order Mark (BOM) in the beginning of output files. */ 68 | // "newLine": "crlf", /* Set the newline character for emitting files. */ 69 | // "stripInternal": true, /* Disable emitting declarations that have '@internal' in their JSDoc comments. */ 70 | // "noEmitHelpers": true, /* Disable generating custom helper functions like '__extends' in compiled output. */ 71 | // "noEmitOnError": true, /* Disable emitting files if any type checking errors are reported. */ 72 | // "preserveConstEnums": true, /* Disable erasing 'const enum' declarations in generated code. */ 73 | // "declarationDir": "./", /* Specify the output directory for generated declaration files. */ 74 | // "preserveValueImports": true, /* Preserve unused imported values in the JavaScript output that would otherwise be removed. */ 75 | 76 | /* Interop Constraints */ 77 | // "isolatedModules": true, /* Ensure that each file can be safely transpiled without relying on other imports. */ 78 | // "verbatimModuleSyntax": true, /* Do not transform or elide any imports or exports not marked as type-only, ensuring they are written in the output file's format based on the 'module' setting. */ 79 | // "allowSyntheticDefaultImports": true, /* Allow 'import x from y' when a module doesn't have a default export. */ 80 | "esModuleInterop": true, /* Emit additional JavaScript to ease support for importing CommonJS modules. This enables 'allowSyntheticDefaultImports' for type compatibility. */ 81 | // "preserveSymlinks": true, /* Disable resolving symlinks to their realpath. This correlates to the same flag in node. */ 82 | "forceConsistentCasingInFileNames": true, /* Ensure that casing is correct in imports. */ 83 | 84 | /* Type Checking */ 85 | "strict": true, /* Enable all strict type-checking options. */ 86 | // "noImplicitAny": true, /* Enable error reporting for expressions and declarations with an implied 'any' type. */ 87 | // "strictNullChecks": true, /* When type checking, take into account 'null' and 'undefined'. */ 88 | // "strictFunctionTypes": true, /* When assigning functions, check to ensure parameters and the return values are subtype-compatible. */ 89 | // "strictBindCallApply": true, /* Check that the arguments for 'bind', 'call', and 'apply' methods match the original function. */ 90 | // "strictPropertyInitialization": true, /* Check for class properties that are declared but not set in the constructor. */ 91 | // "noImplicitThis": true, /* Enable error reporting when 'this' is given the type 'any'. */ 92 | // "useUnknownInCatchVariables": true, /* Default catch clause variables as 'unknown' instead of 'any'. */ 93 | // "alwaysStrict": true, /* Ensure 'use strict' is always emitted. */ 94 | // "noUnusedLocals": true, /* Enable error reporting when local variables aren't read. */ 95 | // "noUnusedParameters": true, /* Raise an error when a function parameter isn't read. */ 96 | // "exactOptionalPropertyTypes": true, /* Interpret optional property types as written, rather than adding 'undefined'. */ 97 | // "noImplicitReturns": true, /* Enable error reporting for codepaths that do not explicitly return in a function. */ 98 | // "noFallthroughCasesInSwitch": true, /* Enable error reporting for fallthrough cases in switch statements. */ 99 | // "noUncheckedIndexedAccess": true, /* Add 'undefined' to a type when accessed using an index. */ 100 | // "noImplicitOverride": true, /* Ensure overriding members in derived classes are marked with an override modifier. */ 101 | // "noPropertyAccessFromIndexSignature": true, /* Enforces using indexed accessors for keys declared using an indexed type. */ 102 | // "allowUnusedLabels": true, /* Disable error reporting for unused labels. */ 103 | // "allowUnreachableCode": true, /* Disable error reporting for unreachable code. */ 104 | 105 | /* Completeness */ 106 | // "skipDefaultLibCheck": true, /* Skip type checking .d.ts files that are included with TypeScript. */ 107 | "skipLibCheck": true /* Skip type checking all .d.ts files. */ 108 | } 109 | } 110 | -------------------------------------------------------------------------------- /public/favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/leptos-rs/start-axum/d075a09bbbf012d01ff46d578c2d3f7e3756ca1a/public/favicon.ico -------------------------------------------------------------------------------- /rust-toolchain.toml: -------------------------------------------------------------------------------- 1 | [toolchain] 2 | channel = "nightly" 3 | -------------------------------------------------------------------------------- /src/app.rs: -------------------------------------------------------------------------------- 1 | use leptos::prelude::*; 2 | use leptos_meta::{provide_meta_context, MetaTags, Stylesheet, Title}; 3 | use leptos_router::{ 4 | components::{Route, Router, Routes}, 5 | StaticSegment, 6 | }; 7 | 8 | pub fn shell(options: LeptosOptions) -> impl IntoView { 9 | view! { 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | } 24 | } 25 | 26 | #[component] 27 | pub fn App() -> impl IntoView { 28 | // Provides context that manages stylesheets, titles, meta tags, etc. 29 | provide_meta_context(); 30 | 31 | view! { 32 | // injects a stylesheet into the document 33 | // id=leptos means cargo-leptos will hot-reload this stylesheet 34 | 35 | 36 | // sets the document title 37 | 38 | 39 | // content for this welcome page 40 | <Router> 41 | <main> 42 | <Routes fallback=|| "Page not found.".into_view()> 43 | <Route path=StaticSegment("") view=HomePage/> 44 | </Routes> 45 | </main> 46 | </Router> 47 | } 48 | } 49 | 50 | /// Renders the home page of your application. 51 | #[component] 52 | fn HomePage() -> impl IntoView { 53 | // Creates a reactive value to update the button 54 | let count = RwSignal::new(0); 55 | let on_click = move |_| *count.write() += 1; 56 | 57 | view! { 58 | <h1>"Welcome to Leptos!"</h1> 59 | <button on:click=on_click>"Click Me: " {count}</button> 60 | } 61 | } 62 | -------------------------------------------------------------------------------- /src/lib.rs: -------------------------------------------------------------------------------- 1 | pub mod app; 2 | 3 | #[cfg(feature = "hydrate")] 4 | #[wasm_bindgen::prelude::wasm_bindgen] 5 | pub fn hydrate() { 6 | use crate::app::*; 7 | console_error_panic_hook::set_once(); 8 | leptos::mount::hydrate_body(App); 9 | } 10 | -------------------------------------------------------------------------------- /src/main.rs: -------------------------------------------------------------------------------- 1 | 2 | #[cfg(feature = "ssr")] 3 | #[tokio::main] 4 | async fn main() { 5 | use axum::Router; 6 | use leptos::logging::log; 7 | use leptos::prelude::*; 8 | use leptos_axum::{generate_route_list, LeptosRoutes}; 9 | use {{crate_name}}::app::*; 10 | 11 | let conf = get_configuration(None).unwrap(); 12 | let addr = conf.leptos_options.site_addr; 13 | let leptos_options = conf.leptos_options; 14 | // Generate the list of routes in your Leptos App 15 | let routes = generate_route_list(App); 16 | 17 | let app = Router::new() 18 | .leptos_routes(&leptos_options, routes, { 19 | let leptos_options = leptos_options.clone(); 20 | move || shell(leptos_options.clone()) 21 | }) 22 | .fallback(leptos_axum::file_and_error_handler(shell)) 23 | .with_state(leptos_options); 24 | 25 | // run our app with hyper 26 | // `axum::Server` is a re-export of `hyper::Server` 27 | log!("listening on http://{}", &addr); 28 | let listener = tokio::net::TcpListener::bind(&addr).await.unwrap(); 29 | axum::serve(listener, app.into_make_service()) 30 | .await 31 | .unwrap(); 32 | } 33 | 34 | #[cfg(not(feature = "ssr"))] 35 | pub fn main() { 36 | // no client-side main function 37 | // unless we want this to work with e.g., Trunk for pure client-side testing 38 | // see lib.rs for hydration function instead 39 | } 40 | -------------------------------------------------------------------------------- /style/main.scss: -------------------------------------------------------------------------------- 1 | body { 2 | font-family: sans-serif; 3 | text-align: center; 4 | } --------------------------------------------------------------------------------