Drop webpack in favour of parcel

essmahr · Sep 30, 2018 · 99931e1 · 99931e1
1 parent 1675908
commit 99931e1
Show file tree

Hide file tree

Showing 8 changed files with 2,697 additions and 891 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,7 +1,9 @@
+.cache
 build
 node_modules
 npm-debug.log
 .env
 config.js
+*.log
 
 .vscode
diff --git a/index.ejs → index.html b/index.ejs → index.html
@@ -101,6 +101,7 @@
     <link href="https://fonts.googleapis.com/css?family=Anton|Overpass+Mono:300,600" rel="stylesheet" type='text/css'>
   </head>
   <body>
+    <link rel="stylesheet" type="text/css" href="./build/app.css">
     <div id="root">
       <div class="loading-overlay">
         <div class="spinner">
@@ -115,5 +116,6 @@
         </div>
       </div>
     </div>
+    <script src="./src/index.js"></script>
   </body>
 </html>
diff --git a/package.json b/package.json
@@ -4,9 +4,12 @@
   "description": "",
   "main": "index.js",
   "scripts": {
-    "test": "echo \"Error: no test specified\" && exit 1",
-    "build": "NODE_ENV=production webpack -p",
-    "start": "NODE_ENV=dev webpack-dev-server --inline --open"
+    "postcss:build": "postcss src/styles/app.css -o ./build/app.css",
+    "postcss:watch": "postcss src/styles/app.css -o ./build/app.css --watch",
+    "parcel:serve": "parcel index.html -d ./build",
+    "parcel:build": "parcel build index.html -d ./build",
+    "build": "run-s postcss:build parcel:build",
+    "start": "run-p postcss:watch parcel:serve"
   },
   "author": "Scott Mahr",
   "license": "ISC",
@@ -21,18 +24,19 @@
     "css-loader": "^0.23.1",
     "html-webpack-plugin": "^2.15.0",
     "lost": "^6.7.2",
+    "npm-run-all": "^4.1.3",
+    "parcel-bundler": "^1.10.1",
     "postcss": "^5.0.19",
+    "postcss-cli": "^6.0.0",
     "postcss-cssnext": "^2.5.2",
     "postcss-extend": "^1.0.1",
     "postcss-import": "^8.1.0",
     "postcss-loader": "^0.8.2",
+    "postcss-modules": "^1.4.1",
     "redux-devtools": "^3.1.0",
     "redux-devtools-dock-monitor": "^1.0.1",
     "redux-devtools-log-monitor": "^1.0.3",
-    "style-loader": "^0.13.1",
-    "webpack": "^1.13.0",
-    "webpack-dev-server": "^1.14.1",
-    "webpack-merge": "^0.8.4"
+    "style-loader": "^0.13.1"
   },
   "dependencies": {
     "classnames": "^2.2.3",

diff --git a/postcss.config.js b/postcss.config.js
@@ -0,0 +1,14 @@
+module.exports = {
+  plugins: {
+    'postcss-import': {},
+    'postcss-functions': {
+      functions: {
+        rem: function (val) {
+          return `${val / 16}rem`;
+        }
+      }},
+    'postcss-extend': {},
+    'postcss-cssnext': {},
+    'lost': {}
+  },
+};
diff --git a/src/components/TimeSpanMenu.js b/src/components/TimeSpanMenu.js
@@ -19,13 +19,6 @@ class TimeSpanButton extends React.Component {
 }
 
 class TimeSpanMenu extends React.Component {
-  timespans = {
-    week: "Past Week",
-    month: "Past Month",
-    year: "Past Year",
-    allTime: "All-Time",
-  };
-
   onClick(span) {
     this.props.changeTimeSpan(span);
   }

diff --git a/src/index.js b/src/index.js
@@ -5,8 +5,6 @@ import { syncHistoryWithStore } from 'react-router-redux';
 import Root from './containers/Root';
 import configureStore from './store/configureStore';
 
-const css = require('./styles/app');
-
 const store = configureStore();
 const history = syncHistoryWithStore(browserHistory, store);
 

diff --git a/webpack.config.js b/webpack.config.js