Skip to content

Commit 51415d4

Browse files
marcograhlmarcograhl
committed
integrated tailwind with svelte, used this template: svelte-starter-postcss
0 parents  commit 51415d4

18 files changed

+6858
-0
lines changed

‎.gitattributes

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
# Auto detect text files and perform LF normalization
2+
* text=auto

‎.gitignore

Lines changed: 77 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,77 @@
1+
# Logs
2+
logs
3+
*.log
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
8+
# Runtime data
9+
pids
10+
*.pid
11+
*.seed
12+
*.pid.lock
13+
14+
# Directory for instrumented libs generated by jscoverage/JSCover
15+
lib-cov
16+
17+
# Coverage directory used by tools like istanbul
18+
coverage
19+
20+
# nyc test coverage
21+
.nyc_output
22+
23+
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
24+
.grunt
25+
26+
# Bower dependency directory (https://bower.io/)
27+
bower_components
28+
29+
# node-waf configuration
30+
.lock-wscript
31+
32+
# Compiled binary addons (https://nodejs.org/api/addons.html)
33+
build/Release
34+
35+
# Dependency directories
36+
node_modules/
37+
jspm_packages/
38+
39+
# TypeScript v1 declaration files
40+
typings/
41+
42+
# Optional npm cache directory
43+
.npm
44+
45+
# Optional eslint cache
46+
.eslintcache
47+
48+
# Optional REPL history
49+
.node_repl_history
50+
51+
# Output of 'npm pack'
52+
*.tgz
53+
54+
# Yarn Integrity file
55+
.yarn-integrity
56+
57+
# dotenv environment variables file
58+
.env
59+
60+
# parcel-bundler cache (https://parceljs.org/)
61+
.cache
62+
63+
# next.js build output
64+
.next
65+
66+
# nuxt.js build output
67+
.nuxt
68+
69+
# vuepress build output
70+
.vuepress/dist
71+
72+
# Serverless directories
73+
.serverless
74+
75+
# FuseBox cache
76+
.fusebox/
77+
.vscode/tasks.json

‎README.md

Lines changed: 66 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
# svelte-starter-postcss
2+
3+
A starter for building Svelte web apps, with PostCSS supported.
4+
5+
## Getting Started
6+
7+
Install using [degit](https://github.com/Rich-Harris/degit):
8+
9+
```bash
10+
npx degit github:noprodev/svelte-starter-postcss your-project-folder
11+
cd your-project-folder
12+
```
13+
14+
Then, install the dependencies:
15+
16+
```bash
17+
npm install
18+
```
19+
20+
## Use PostCSS in Your Svelte Project
21+
22+
- [postcss-preset-env](https://preset-env.cssdb.org/), [PostCSS color-mod() Function](https://github.com/jonathantneal/postcss-color-mod-function) and [cssnano](https://cssnano.co/) are enabled already.
23+
- Add plugins as required (use <code>postcss.config.js</code>).
24+
- You can use PostCSS in your static stylesheets AND Svelte components!
25+
26+
```HTML
27+
<!-- App.svelte -->
28+
<style>
29+
main {
30+
width: 35em;
31+
margin: 1.5em auto;
32+
/* Nesting */
33+
& > h1 {
34+
/* Color manipulation */
35+
color: color-mod(#0000ff shade(20%));
36+
}
37+
}
38+
</style>
39+
40+
<main>
41+
<h1>Hello World!</h1>
42+
</main>
43+
```
44+
45+
## Building and Developing
46+
47+
### Build
48+
49+
```bash
50+
npm run build
51+
```
52+
53+
### Development
54+
55+
Development mode will:
56+
57+
- build on file change
58+
- serve locally at <code>localhost:5000</code>
59+
- live reload
60+
61+
```bash
62+
npm run dev
63+
```
64+
## Credits
65+
66+
Inspired by [sveltejs/template](https://github.com/sveltejs/template)

‎dist/components.css

Lines changed: 3 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/components.css.map

Lines changed: 12 additions & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎dist/index.html

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
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+
<link rel="stylesheet" href="main.css">
8+
<link rel="stylesheet" href="components.css">
9+
<title>Svelte App</title>
10+
</head>
11+
<body>
12+
13+
<script src="main.js"></script>
14+
</body>
15+
</html>

‎dist/main.css

Lines changed: 1 addition & 0 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)