oss vue sfc boiler

Author: shwilliam

.gitignore

@@ -0,0 +1,2 @@
+/node_modules/
+/dist/

build/rollup.config.js

@@ -0,0 +1,28 @@
+import vue from "rollup-plugin-vue";
+import buble from "rollup-plugin-buble";
+import uglify from "rollup-plugin-uglify-es";
+import minimist from "minimist";
+
+const argv = minimist(process.argv.slice(2));
+
+const config = {
+  input: "src/index.js",
+  output: {
+    name: "VueScrollState",
+    exports: "named"
+  },
+  plugins: [
+    vue({
+      css: true,
+      compileTemplate: true
+    }),
+    buble()
+  ]
+};
+
+// minify browser (iife) version
+if (argv.format === "iife") {
+  config.plugins.push(uglify());
+}
+
+export default config;

examples/example-1.vue

@@ -0,0 +1,18 @@
+<template>
+  <div>
+      <VueScrollState />
+  </div>
+</template>
+
+<script>
+import VueScrollState from "../src/vue-scroll-state.vue";
+export default {
+  name: "Example1",
+  data() {
+    return {};
+  },
+  components: {
+    VueScrollState
+  }
+};
+</script>

package.json

@@ -0,0 +1,30 @@
+{
+  "name": "vue-scroll-state",
+  "version": "0.1.0",
+  "description": "",
+  "license": "MIT",
+  "main": "dist/vue-scroll-state.umd.js",
+  "module": "dist/vue-scroll-state.esm.js",
+  "unpkg": "dist/vue-scroll-state.min.js",
+  "browser": {
+    "./sfc": "src/vue-scroll-state.vue"
+  },
+  "scripts": {
+    "dev": "vue serve ./src/vue-scroll-state.vue",
+    "example": "vue serve ./examples/example-1.vue",
+    "build": "npm run build:unpkg & npm run build:es & npm run build:umd",
+    "build:umd": "rollup --config build/rollup.config.js --format umd --file dist/vue-scroll-state.umd.js",
+    "build:es": "rollup --config build/rollup.config.js --format es --file dist/vue-scroll-state.esm.js",
+    "build:unpkg": "rollup --config build/rollup.config.js --format iife --file dist/vue-scroll-state.min.js"
+  },
+  "dependencies": {},
+  "devDependencies": {
+    "minimist": "^1.2.0",
+    "rollup": "^0.57.1",
+    "rollup-plugin-buble": "^0.19.2",
+    "rollup-plugin-uglify-es": "0.0.1",
+    "rollup-plugin-vue": "^3.0.0",
+    "vue": "^2.5.16",
+    "vue-template-compiler": "^2.5.16"
+  }
+}

src/index.js

@@ -0,0 +1,26 @@
+import component from "./vue-scroll-state.vue";
+
+// install function executed by Vue.use()
+export function install(Vue) {
+  if (install.installed) return;
+  install.installed = true;
+  Vue.component("VueScrollState", component);
+}
+
+// create module definition for Vue.use()
+const plugin = {
+  install
+};
+
+// auto-install when vue is found
+let GlobalVue = null;
+if (typeof window !== "undefined") {
+  GlobalVue = window.Vue;
+} else if (typeof global !== "undefined") {
+  GlobalVue = global.Vue;
+}
+if (GlobalVue) {
+  GlobalVue.use(plugin);
+}
+
+export default component;

src/vue-scroll-state.vue

@@ -0,0 +1,17 @@
+<script>
+export default {
+  name: "VueScrollState",
+  data() {
+    return {};
+  }
+};
+</script>
+
+<template>
+    <div class="vue-scroll-state">
+        hello world
+    </div>
+</template>
+
+<style scoped>
+</style>