Skip to content

Instantly share code, notes, and snippets.

@eirikb

eirikb/.sassrc.js

Created March 15, 2018 09:24
Show Gist options
  • Save eirikb/ea6248feab5411a5e4a6bf720ab984fe to your computer and use it in GitHub Desktop.
Save eirikb/ea6248feab5411a5e4a6bf720ab984fe to your computer and use it in GitHub Desktop.
Download ZIP
Demo of parcel + scss
Raw
.sassrc.js
const path = require('path');
const cwd = process.cwd();
module.exports = {
"includePaths": [
path.resolve(cwd, 'node_modules'),
path.resolve(cwd, 'src')
]
};
Raw
app.js
import {MDCRipple} from '@material/ripple';
const button = document.createElement('button');
button.classList.add('mdc-button', 'mdc-button--raised');
button.innerText = 'Hello, world!';
new MDCRipple(button);
document.querySelector('#app').appendChild(button);
Raw
app.scss
@import "@material/button/mdc-button";
@import "@material/typography/mdc-typography";
Raw
index.html
<!doctype html>
<html lang="en">
<head>
<title>Demo</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<link rel="stylesheet" href="./app.scss"/>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500">
</head>
<body class="mdc-typography">
<div id="app"></div>
<script src="./app.js"></script>
</body>
</html>
Raw
package.json
{
"name": "demo",
"version": "1.0.0",
"description": "",
"main": "app.js",
"scripts": {
"start": "parcel index.html"
},
"author": "Eirik Brandtzæg <[email protected]>",
"license": "MIT",
"dependencies": {
"@material/button": "0.32.0",
"@material/typography": "0.28.0"
},
"devDependencies": {
"node-sass": "4.7.2",
"parcel-bundler": "1.6.2"
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment