Last active
February 27, 2023 10:17
-
-
Save zavan/a8f55043b7e197c7948ec535d36b5dd8 to your computer and use it in GitHub Desktop.
Simple NPM + Vite + PostCSS
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<head> | |
<meta charset="utf-8"> | |
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> | |
<title>Dummy eSite</title> | |
<!-- CSS Assets --> | |
<link rel="stylesheet" href="/src/styles.css"> | |
</head> | |
<body> | |
<h1>Hello!</h1> | |
<!-- JS Assets --> | |
<script type="module" src="/src/main.js"></script> | |
</body> | |
</html> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// Gist won't let me, but this file should be in the src/ subdirectory. | |
import './styles.css'; | |
console.log('Your JS code goes here. Use ES modules import dependencies and organize your code.'); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{ | |
"name": "spillover-site-templates-roma", | |
"version": "1.0.0", | |
"description": "Spillover Roma site template.", | |
"author": "Felipe Zavan <[email protected]>", | |
"license": "UNLICENSED", | |
"private": true, | |
"type": "module", | |
"module": "src/main.js", | |
"scripts": { | |
"start": "vite --host", | |
"build": "vite build", | |
"preview": "vite preview", | |
}, | |
"dependencies": { | |
"@fortawesome/fontawesome-svg-core": "^6.3.0", | |
"@fortawesome/free-solid-svg-icons": "^6.3.0" | |
}, | |
"devDependencies": { | |
"autoprefixer": "^10.4.13", | |
"postcss-nesting": "^11.2.1", | |
"vite": "^4.1.4" | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
export default { | |
plugins: { | |
"postcss-import": {}, | |
"postcss-nesting": {}, | |
autoprefixer: {}, | |
}, | |
}; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* Gist won't let me, but this file should be in the src/ subdirectory. */ | |
.main { | |
background-color: #FF0000; | |
h1 { | |
padding: 0; | |
} | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
import { fileURLToPath, URL } from "url"; | |
function fullPath(path) { | |
return fileURLToPath(new URL(path, import.meta.url)); | |
} | |
// https://vitejs.dev/config/ | |
export default defineConfig({ | |
resolve: { | |
alias: { | |
// So modules can be imported relative to src instead of ../../../... | |
"@": fullPath("./src"), | |
}, | |
}, | |
}); |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment