Skip to content

Commit d23876e

Browse files
codechipscodechips
committed
Initial commit
0 parents  commit d23876e

File tree

13 files changed

+5770
-0
lines changed

13 files changed

+5770
-0
lines changed

‎.eslintrc.json‎

Lines changed: 22 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,22 @@
1+
{
2+
"env": {
3+
"browser": true,
4+
"es6": true
5+
},
6+
"parserOptions": {
7+
"ecmaVersion": 2019,
8+
"sourceType": "module"
9+
},
10+
"plugins": ["svelte3"],
11+
"extends": ["eslint:recommended"],
12+
"overrides": [
13+
{
14+
"files": ["**/*.svelte"],
15+
"processor": "svelte3/svelte3"
16+
}
17+
],
18+
"rules": {
19+
"prettier/prettier": "error",
20+
"svelte3/lint-template": 2
21+
}
22+
}

‎.gitignore‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
.cache
2+
node_modules
3+
dist

‎.prettierrc.json‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"tabWidth": 2,
3+
"semi": true,
4+
"singleQuote": true,
5+
"plugins": ["prettier-plugin-svelte"],
6+
"svelteSortOrder": "styles-scripts-markup",
7+
"svelteStrictMode": true,
8+
"svelteBracketNewLine": true,
9+
"svelteAllowShorthand": true
10+
}

‎README.md‎

Lines changed: 39 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
# svelte-tailwind-parcel-starter
2+
3+
Svelte.js starter pack with [Yarn](https://yarnpkg.com/),
4+
[Tailwind](https://tailwindcss.com/) and [Parcel](https://parceljs.org/). Yummy mummy!
5+
6+
The starter pack also includes
7+
[tailwindcss-font-inter](https://github.com/semencov/tailwindcss-font-inter)
8+
plugin for Tailwind plus Prettier and Eslint plugins with opinionated settings.
9+
10+
## Getting started
11+
12+
```
13+
# create new project
14+
$ npx degit iljoo/svelte-tailwind-parcel-starter facebook-killer
15+
$ cd facebook-killer
16+
17+
# install required packages
18+
$ yarn
19+
20+
# run the app
21+
$ yarn start
22+
23+
# build the app
24+
$ yarn build
25+
```
26+
27+
## Testing
28+
29+
Yep. You should definitely test your code.
30+
31+
## Disclaimer
32+
33+
I take no responsibility if you get paid less because you have become more
34+
productive with these awesome tools and suddenly started getting things done
35+
faster.
36+
37+
## Questions?
38+
39+
Find me on Twitter - [@ilia_mikhailov](https://twitter.com/ilia_mikhailov).

‎package.json‎

Lines changed: 28 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,28 @@
1+
{
2+
"name": "svelte-parcel-talwind-starter",
3+
"version": "1.0.0",
4+
"description": "Svelte with Tailwind and Parcel",
5+
"main": "./src/main.js",
6+
"author": "iljoo",
7+
"license": "MIT",
8+
"private": false,
9+
"scripts": {
10+
"start": "parcel src/index.html --port 3000",
11+
"build": "rm -rf dist && parcel build src/index.html --no-source-maps"
12+
},
13+
"browserslist": [
14+
"last 1 chrome versions"
15+
],
16+
"devDependencies": {
17+
"@fullhuman/postcss-purgecss": "^1.3.0",
18+
"autoprefixer": "^9.7.3",
19+
"eslint-plugin-svelte3": "^2.7.3",
20+
"parcel-bundler": "^1.12.4",
21+
"parcel-plugin-svelte": "^4.0.5",
22+
"prettier": "^1.19.1",
23+
"prettier-plugin-svelte": "^0.7.0",
24+
"svelte": "^3.16.7",
25+
"tailwindcss": "^1.1.4",
26+
"tailwindcss-font-inter": "^1.0.7"
27+
}
28+
}

‎postcss.config.js‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
const plugins =
2+
process.env.NODE_ENV === 'production'
3+
? ['tailwindcss', 'autoprefixer', '@fullhuman/postcss-purgecss']
4+
: ['tailwindcss'];
5+
6+
module.exports = {plugins};

‎purgecss.config.js‎

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
module.exports = {
2+
content: [
3+
'./src/index.html',
4+
'./src/**/*.svelte'
5+
],
6+
whitelistPatterns: [/svelte-/],
7+
defaultExtractor: content => content.match(/[A-Za-z0-9-_:/]+/g) || []
8+
};
9+

‎src/App.svelte‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<script>
2+
let framework = 'svelte.js';
3+
let bundler = 'parcel.js';
4+
let css = 'tailwind.css';
5+
</script>
6+
7+
<div class="font-inter flex flex-grow h-screen justify-center items-center">
8+
<div class="text-center">
9+
<h1 class="text-5xl">
10+
<span class="text-yellow-900">{framework}</span>
11+
+
12+
<span class="text-blue-900">{css}</span>
13+
+
14+
<span class="text-green-900">{bundler}</span>
15+
=
16+
<span class="font-semibold text-red-900">awesome</span>
17+
</h1>
18+
<p class="text-3xl mt-4">
19+
* also includes
20+
<strong>Prettier</strong>
21+
and
22+
<strong>ESLint</strong>
23+
configs with opinionated settings
24+
</p>
25+
</div>
26+
</div>

‎src/global.pcss‎

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
@tailwind base;
2+
@tailwind components;
3+
@tailwind utilities;

‎src/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+
<title>svelte.js + tailwind.css + parcel.js</title>
8+
<link rel="stylesheet" href="./global.pcss" />
9+
</head>
10+
11+
<body class="bg-white antialiased text-gray-800">
12+
<script defer src="./main.js"></script>
13+
<noscript>You need to enable JavaScript to run this app.</noscript>
14+
</body>
15+
</html>

0 commit comments

Comments
 (0)