build: use vite

istudyatuni · Apr 15, 2022 · d081232 · d081232
1 parent c7db305
commit d081232
Show file tree

Hide file tree

Showing 14 changed files with 381 additions and 3,946 deletions.
diff --git a/public/index.html → index.html b/public/index.html → index.html
@@ -12,6 +12,6 @@
   </head>
   <body>
     <noscript>You need to enable JavaScript to run this app.</noscript>
-    <script type="module" src="dist/index.js"></script>
+    <script type="module" src="/src/index.js"></script>
   </body>
 </html>
diff --git a/jest.config.js b/jest.config.js
diff --git a/jest.setup.js b/jest.setup.js
diff --git a/package.json b/package.json
@@ -1,24 +1,20 @@
 {
   "public": false,
   "scripts": {
-    "dev": "snowpack dev",
-    "build": "snowpack build",
+    "dev": "vite",
+    "build": "vite build",
     "build:wasm": "./scripts/build/wasm.sh",
     "test": "jest",
     "prepare": "husky install .husky",
     "format": "redrun format:eslint format:prettier",
-    "format:eslint": "eslint --fix --ext .js  --ext .mjs --ext .svelte .",
-    "format:prettier": "prettier --write --plugin-search-dir=. './**/*.{js,mjs,svelte}'",
+    "format:eslint": "eslint --fix --ext .js --ext .svelte .",
+    "format:prettier": "prettier --write --plugin-search-dir=. './**/*.{js,svelte}'",
     "format:check": "redrun format:check:eslint format:check:prettier",
     "format:check:eslint": "eslint --ext .js --ext .svelte .",
-    "format:check:prettier": "prettier --check --plugin-search-dir=. './**/*.{js,mjs,svelte}'"
+    "format:check:prettier": "prettier --check --plugin-search-dir=. './**/*.{js,svelte}'"
   },
   "devDependencies": {
-    "@snowpack/app-scripts-svelte": "^2.0.1",
-    "@snowpack/plugin-dotenv": "^2.2.0",
-    "@snowpack/plugin-postcss": "^1.4.3",
-    "@snowpack/plugin-run-script": "^2.3.0",
-    "@snowpack/plugin-svelte": "^3.7.0",
+    "@sveltejs/vite-plugin-svelte": "^1.0.0-next.37",
     "@testing-library/jest-dom": "^5.16.1",
     "@testing-library/svelte": "^3.0.3",
     "autoprefixer": "^10.4.2",
@@ -33,11 +29,12 @@
     "prettier": "^2.5.1",
     "prettier-plugin-svelte": "^2.6.0",
     "redrun": "^9.0.1",
-    "snowpack": "^3.8.8",
-    "snowpack-plugin-rollup-bundle": "^0.4.4",
+    "sass": "^1.49.8",
     "svelte": "^3.46.3",
-    "svelte-check": "^2.3.0",
+    "svelte-jester": "^2.3.2",
+    "svelte-preprocess": "^4.10.3",
     "svelte-storages": "^0.0.2",
-    "tailwindcss": "^3.0.18"
+    "tailwindcss": "^3.0.18",
+    "vite": "^2.8.4"
   }
 }
diff --git a/public/logo.svg b/public/logo.svg
diff --git a/snowpack.config.mjs b/snowpack.config.mjs
diff --git a/src/global.scss b/src/global.scss
@@ -0,0 +1,3 @@
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
diff --git a/src/index.js b/src/index.js
@@ -1,19 +1,8 @@
-import 'src/tailwind.svelte'
 import App from 'src/components/App.svelte'
+import 'src/global.scss'
 
 const app = new App({
 	target: document.body,
 })
 
 export default app
-
-// hmm, removing this not removed HMR
-
-// Hot Module Replacement (HMR) - Remove this snippet to remove HMR.
-// Learn more: https://www.snowpack.dev/#hot-module-replacement
-// if (import.meta.hot) {
-// 	import.meta.hot.accept()
-// 	import.meta.hot.dispose(() => {
-// 		app.$destroy()
-// 	})
-// }
diff --git a/src/tailwind.svelte b/src/tailwind.svelte
diff --git a/svelte.config.js b/svelte.config.js
@@ -0,0 +1,11 @@
+const sveltePreprocess = require('svelte-preprocess')
+
+const preprocess = sveltePreprocess({
+	postcss: {
+		plugins: [require('tailwindcss'), require('autoprefixer')],
+	},
+})
+
+module.exports = {
+	preprocess,
+}
diff --git a/tailwind.config.js b/tailwind.config.js
@@ -1,5 +1,5 @@
 module.exports = {
-	content: ['./src/**/*.svelte', './public/*.html'],
+	content: ['./src/**/*.svelte'],
 	theme: {
 		extend: {},
 	},

diff --git a/test/App.test.js b/test/App.test.js
diff --git a/vite.config.js b/vite.config.js
@@ -0,0 +1,44 @@
+import postcss from './postcss.config.js'
+import { svelte } from '@sveltejs/vite-plugin-svelte'
+
+import path from 'path'
+
+/**
+ * @return {import('vite').ProxyOptions}
+ */
+/*const singleProxy = (path, port) => ({
+	target: 'http://localhost:' + port,
+	changeOrigin: true,
+	rewrite: (url) => url.replace(new RegExp(`^/${path}`), ''),
+})*/
+
+/**
+ * @type {import('vite').UserConfig}
+ */
+const config = {
+	plugins: [svelte()],
+	css: { postcss },
+	resolve: {
+		alias: {
+			src: path.resolve(__dirname, './src'),
+		},
+	},
+	esbuild: {
+		include: ['js', 'svelte'],
+	},
+	clearScreen: false,
+	server: {
+		port: 8080,
+		proxy: {
+			// '/api': singleProxy('api', 4000),
+		},
+	},
+	build: {
+		sourcemap: true,
+		minify: true,
+		outDir: 'build',
+	},
+	// base: '/',
+}
+
+export default config