Skip to content

Instantly share code, notes, and snippets.

@mamcx
Last active June 4, 2018 00:46
Show Gist options
  • Save mamcx/1d3aa692b0d34b0fae696c12292a1a6c to your computer and use it in GitHub Desktop.
Save mamcx/1d3aa692b0d34b0fae696c12292a1a6c to your computer and use it in GitHub Desktop.
Non non-sense javascript front-end setup with vue/quasar
/* Your own css. */
/* Your own js. */
// Utils
function GET(url, post) {
return fetch(url, post)
.then(function(response) {
console.log('RES', response)
return response;
})
}
// Components
const toolbar = {
template: '#toolbar',
props: ['title', 'action']
};
// Pages
//Routing
let router = new VueRouter({
routes: [
]
})
new Vue({
el: '#app',
router,
template: '#base',
data() {
return {
};
}
})
# You super simple "build" tool. Concat all your deps locally, then just leave your custom css/js.
cat js/vue.js js/vue-router.js js/vuex.js js/quasar.ios.umd.js> js/build.js
cat css/material-icons.css css/quasar.ios.css css/animate.min.css > css/build.css
<!DOCTYPE html>
<html lang="en-us">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="format-detection" content="telephone=no">
<meta name="msapplication-tap-highlight" content="no">
<meta name="viewport" content="user-scalable=no,initial-scale=1,maximum-scale=1,minimum-scale=1,width=device-width">
<link href="css/build.css" rel="stylesheet" type="text/css">
<link href="css/app.css" rel="stylesheet">
<script src="js/build.js"></script>
</head>
<body>
<template id="toolbar">
<q-toolbar slot="header">
<q-btn
flat
round
dense
icon="menu"
></q-btn>
<q-toolbar-title>
{{title}}
</q-toolbar-title>
</q-toolbar>
</template>
<template id="HomePage">
</template>
<template id="base">
<router-view />
</template>
<div id="app">
</div>
<script src="js/app.js"></script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment