Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly
Appearance settings
This repository was archived by the owner on Jul 22, 2020. It is now read-only.

Commit 4937b4b

Browse filesBrowse files
dafndafn
dafn
authored and
dafn
committed
svelte-typescript-rollup
1 parent 70b8d71 commit 4937b4b
Copy full SHA for 4937b4b

File tree

Expand file treeCollapse file tree

10 files changed

+1969
-1
lines changed
Filter options
Expand file treeCollapse file tree

10 files changed

+1969
-1
lines changed

‎.gitignore

Copy file name to clipboard
+4Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,4 @@
1+
node_modules
2+
dist
3+
.rpt2_cache
4+
*.log

‎README.md

Copy file name to clipboard
+12-1Lines changed: 12 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,13 @@
11
# svelte-typescript
2-
Svelte with typescript using rollup
2+
3+
Boilerplate example of Svelte with Typescript using Rollup
4+
5+
Start development server
6+
```
7+
yarn serve
8+
```
9+
10+
Build for production
11+
```
12+
yarn build
13+
```

‎package.json

Copy file name to clipboard
+27Lines changed: 27 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,27 @@
1+
{
2+
"name": "svelte-typescript-rollup",
3+
"version": "1.0.0",
4+
"main": "src/index.ts",
5+
"license": "MIT",
6+
"scripts": {
7+
"serve": "rm -rf ./dist && NODE_ENV=development rollup --config --watch",
8+
"build": "rm -rf ./dist && NODE_ENV=production rollup --config"
9+
},
10+
"dependencies": {
11+
"svelte": "^3.9.1"
12+
},
13+
"devDependencies": {
14+
"rollup": "^1.20.0",
15+
"rollup-plugin-bundle-html": "^0.2.1",
16+
"rollup-plugin-commonjs": "^10.0.2",
17+
"rollup-plugin-css-porter": "^1.0.2",
18+
"rollup-plugin-livereload": "^1.0.1",
19+
"rollup-plugin-node-resolve": "^5.2.0",
20+
"rollup-plugin-serve": "^1.0.1",
21+
"rollup-plugin-svelte": "^5.1.0",
22+
"rollup-plugin-terser": "^5.1.1",
23+
"rollup-plugin-typescript2": "^0.22.1",
24+
"svelte-ts-preprocess": "^1.1.3",
25+
"typescript": "^3.5.3"
26+
}
27+
}

‎rollup.config.js

Copy file name to clipboard
+52Lines changed: 52 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,52 @@
1+
import svelte from "rollup-plugin-svelte"
2+
import commonjs from "rollup-plugin-commonjs"
3+
import resolve from "rollup-plugin-node-resolve"
4+
import serve from "rollup-plugin-serve"
5+
import html from "rollup-plugin-bundle-html"
6+
import css from "rollup-plugin-css-porter"
7+
import typescript from "rollup-plugin-typescript2"
8+
import typescriptCompiler from "typescript"
9+
import { terser } from "rollup-plugin-terser"
10+
import livereload from "rollup-plugin-livereload"
11+
import { preprocess as svelteTsPreprocess } from "svelte-ts-preprocess"
12+
13+
const plugins = [
14+
svelte({
15+
dev: process.env.NODE_ENV === "development",
16+
extensions: [".svelte"],
17+
preprocess: svelteTsPreprocess(),
18+
}),
19+
html({
20+
template: "src/index.html",
21+
dest: "dist",
22+
filename: "index.html"
23+
}),
24+
css({
25+
dest: 'dist/index.css',
26+
raw: false
27+
}),
28+
typescript({ typescript: typescriptCompiler }),
29+
commonjs({ include: "node_modules/**" }),
30+
resolve()
31+
];
32+
if (process.env.NODE_ENV === "development") {
33+
plugins.push(
34+
serve({
35+
contentBase: './dist',
36+
open: false
37+
}),
38+
livereload({ watch: "./dist" })
39+
);
40+
} else {
41+
plugins.push(terser({ sourcemap: true }))
42+
}
43+
44+
module.exports = {
45+
input: "src/index.ts",
46+
output: {
47+
file: "dist/index.js",
48+
sourcemap: true,
49+
format: "iife"
50+
},
51+
plugins
52+
}

‎src/index.html

Copy file name to clipboard
+13Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
<html lang="en">
2+
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width, initial-scale=1.0">
6+
<meta http-equiv="X-UA-Compatible" content="ie=edge">
7+
<title>Svelte + Typescript</title>
8+
</head>
9+
10+
<body>
11+
</body>
12+
13+
</html>

‎src/index.svelte

Copy file name to clipboard
+21Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
<script lang="ts">
2+
const a: string = "Svelte",
3+
b: string = "Typescript",
4+
c: string = "Rollup";
5+
</script>
6+
7+
<style>
8+
:global(body) {
9+
display: flex;
10+
justify-content: center;
11+
align-items: center;
12+
}
13+
14+
h1 {
15+
font: normal 24pt Lato, "Helvetica Neue", Arial, Helvetica, sans-serif;
16+
color: dimgray;
17+
cursor: default;
18+
}
19+
</style>
20+
21+
<h1>{a} + {b} + {c}</h1>

‎src/index.ts

Copy file name to clipboard
+5Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
import Svelte from './index.svelte'
2+
3+
new Svelte({
4+
target: document.body
5+
})

‎src/types/svelte.d.ts

Copy file name to clipboard
+25Lines changed: 25 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
declare module "*.svelte" {
2+
interface ComponentOptions<Props> {
3+
target: HTMLElement;
4+
anchor?: HTMLElement;
5+
props?: Props;
6+
hydrate?: boolean;
7+
intro?: boolean;
8+
}
9+
10+
interface Component<Props> {
11+
new (options: ComponentOptions<Props>): any;
12+
$set: (props: {}) => any;
13+
$on: (event: string, callback: (event: CustomEvent) => any) => any;
14+
$destroy: () => any;
15+
render: (props?: {}) => {
16+
html: string;
17+
css: { code: string; map?: string };
18+
head?: string;
19+
};
20+
}
21+
22+
const component: Component<{}>;
23+
24+
export default component;
25+
}

‎tsconfig.json

Copy file name to clipboard
+11Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
{
2+
"compilerOptions": {
3+
"target": "es5",
4+
"module": "esnext",
5+
"baseUrl": "./",
6+
"outDir": "./build"
7+
},
8+
"include": [
9+
"src/**/*"
10+
]
11+
}

0 commit comments

Comments
0 (0)
Morty Proxy This is a proxified and sanitized view of the page, visit original site.