minimal impl using vue-component-compiler

Author: znck

.babelrc

@@ -1,9 +1,10 @@
 {
   "presets": [
-    [ "es2015", { "modules": false }],
-    "stage-2"
-  ],
-  "plugins": ["transform-runtime"],
-  "retainLines": true,
-  "comments": true
+    ["@babel/preset-env", {
+      "modules": false,
+      "targets": {
+        "node": 6
+      }
+    }]
+  ]
 }

.editorconfig

@@ -0,0 +1,14 @@
+# editorconfig.org
+
+root = true
+
+[*]
+charset = utf-8
+end_of_line = lf
+indent_size = 2
+indent_style = space
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+trim_trailing_whitespace = false

.eslintrc.json

@@ -1,7 +1,9 @@
 dist/
 /.github/sereno/public
 /_cache
-test/style.css
+
+test/target/
+
 # Logs
 logs/
 *.log

.gitignore

@@ -1,14 +1,14 @@
-"use strict";
+'use strict'
 
-let pack = require('../package.json');
+const pack = require('../package.json')
 
-const VERSION = process.env.VERSION || pack.version;
-const YEAR = new Date().getFullYear();
+const VERSION = process.env.VERSION || pack.version
+const YEAR = new Date().getFullYear()
 
 const BANNER = `/*!
  * ${pack.name} v${VERSION}
  * (c) ${YEAR} ${pack.author}
  * Release under the ${pack.license} License.
- */`;
+ */`
 
-module.exports = BANNER;
+module.exports = BANNER

.npmignore

@@ -2,65 +2,48 @@
 
 const babel = require('rollup-plugin-babel')
 const rollup = require('rollup')
-const replace = require('rollup-plugin-replace')
-const zlib = require('zlib')
 const fs = require('fs')
 const pack = require('../package.json')
-const banner = require('./banner')
 
-const main = fs
-      .readFileSync('src/index.js', 'utf-8')
-      .replace(/plugin\.version = '[\d\.]+'/, `plugin.version = '${pack.version}'`)
+const dependencies = Object.keys(pack.dependencies).concat('path')
 
-fs.writeFileSync('src/index.js', main)
-
-rollup.rollup({
-    input: 'src/index.js',
+rollup
+  .rollup({
+    entry: 'src/index.js',
+    external(id) {
+      return dependencies.some(it => it === id || id.startsWith(it))
+    },
     plugins: [
-        babel({ runtimeHelpers: true })
-    ],
-    external (id) {
-        if (/babel-runtime\/.*/i.test(id)) {
-            return true
-        }
-
-        return [
-            'camelcase',
-            'coffeescript-compiler',
-            'de-indent',
-            'debug',
-            'fs',
-            'hash-sum',
-            'html-minifier',
-            'less',
-            'magic-string',
-            'merge-options',
-            'node-sass',
-            'parse5',
-            'path',
-            'postcss',
-            'postcss-load-config',
-            'postcss-modules',
-            'postcss-selector-parser',
-            'posthtml',
-            'posthtml-attrs-parser',
-            'pug',
-            'rollup-pluginutils',
-            'stylus',
-            'vue-template-es2015-compiler',
-            'vue-template-validator',
-            'typescript'
-        ].indexOf(id) > -1
-    }
-}).then(function (bundle) {
+      babel({
+        exclude: 'node_modules/**',
+        babelrc: false,
+        presets: [
+          [
+            '@babel/preset-env',
+            {
+              modules: false,
+              target: { node: 6 }
+            }
+          ]
+        ],
+        plugins: [
+          '@babel/plugin-proposal-object-rest-spread',
+          '@babel/plugin-transform-runtime'
+        ],
+        runtimeHelpers: true
+      })
+    ]
+  })
+  .then(function(bundle) {
     bundle.write({
-        format: 'cjs',
-        file: 'dist/' + pack.name + '.common.js'
+      format: 'cjs',
+      dest: 'dist/' + pack.name + '.common.js'
     })
     bundle.write({
-        format: 'es',
-        file: 'dist/' + pack.name + '.js'
+      format: 'es',
+      dest: 'dist/' + pack.name + '.js'
     })
-}).catch(function logError (e) {
+  })
+  .catch(function logError(e) {
     console.log(e)
-})
+  })

config/banner.js

@@ -1,51 +1,58 @@
 const languages = {
-    title: 'Language',
-    type: 'dropdown',
-    exact: true,
-    items: [
-        { title: 'English', path: '/en/', matchPath: /\/en\/.*/i }
-    ]
+  title: 'Language',
+  type: 'dropdown',
+  exact: true,
+  items: [{ title: 'English', path: '/en/', matchPath: /\/en\/.*/i }]
 }
 
 const home = { title: 'Home', path: '/' }
 
 const versions = [
-    { title: 'Version 2.2', path: '/2.2/', matchPath: /^\/([a-z-]+)\/2.2\/.*/i },
-    { title: 'Version 2.3', path: '/2.3/', matchPath: /^\/([a-z-]+)\/2.3\/.*/i },
+  { title: 'Version 2.2', path: '/2.2/', matchPath: /^\/([a-z-]+)\/2.2\/.*/i },
+  { title: 'Version 2.3', path: '/2.3/', matchPath: /^\/([a-z-]+)\/2.3\/.*/i }
 ]
 
 function lang_version(lang) {
-    const version = {
-        title: 'Version',
-        type: 'dropdown',
-        exact: true,
-    }
-    version.items = versions.map(function (v) {
-        const ver = Object.assign({}, v)
-        ver.path = '/' + lang + ver.path
-
-        return ver
-    })
+  const version = {
+    title: 'Version',
+    type: 'dropdown',
+    exact: true
+  }
+  version.items = versions.map(function(v) {
+    const ver = Object.assign({}, v)
+    ver.path = '/' + lang + ver.path
 
-    return version
+    return ver
+  })
+
+  return version
 }
 
 docute.init({
-    repo: 'vuejs/rollup-plugin-vue',
-    'edit-link': 'https://github.com/vuejs/rollup-plugin-vue/edit/master/docs',
-
-    nav: {
-        default: [home, languages, lang_version('en')],
-        'en2.3': [{ title: 'Home', path: '/en/2.3/' }, { title: 'Examples', path: '/en/2.3/examples' }, languages, lang_version('en')],
-        'en2.2': [{ title: 'Home', path: '/en/2.2/' }, { title: 'Examples', path: '/en/2.2/examples' }, languages, lang_version('en')],
-    },
-
-    plugins: [
-        docsearch({
-            apiKey: '7792597613e997afeb0b75a206ca0c5a',
-            indexName: 'rollup-plugin-vue',
-            url: 'https://vuejs.github.io/rollup-plugin-vue'
-        })
+  repo: 'vuejs/rollup-plugin-vue',
+  'edit-link': 'https://github.com/vuejs/rollup-plugin-vue/edit/master/docs',
+
+  nav: {
+    default: [home, languages, lang_version('en')],
+    'en2.3': [
+      { title: 'Home', path: '/en/2.3/' },
+      { title: 'Examples', path: '/en/2.3/examples' },
+      languages,
+      lang_version('en')
+    ],
+    'en2.2': [
+      { title: 'Home', path: '/en/2.2/' },
+      { title: 'Examples', path: '/en/2.2/examples' },
+      languages,
+      lang_version('en')
     ]
-    
+  },
+
+  plugins: [
+    docsearch({
+      apiKey: '7792597613e997afeb0b75a206ca0c5a',
+      indexName: 'rollup-plugin-vue',
+      url: 'https://vuejs.github.io/rollup-plugin-vue'
+    })
+  ]
 })

config/build.js

@@ -1,23 +1,13 @@
 <template>
-  <div class="hello">
-    <h1 class="hello__title">{{ msg }}</h1>
-  </div>
+  <div class="hello"></div>
 </template>
 
 <script>
 export default {
-  data () {
+  data() {
     return {
       msg: 'Hello World!'
     }
   }
 }
 </script>
-
-<style lang="stylus">
-.hello {
-  &__title {
-    color: #42b983;
-  }
-}
-</style>

docs/config.js

@@ -0,0 +1 @@
+{"hello":"_hello_14kxd_18"}

example/Hello.vue

@@ -6,35 +6,21 @@ const CleanCSS = require('clean-css')
 const fs = require('fs')
 const stylus = require('stylus')
 
-
 rollup({
   entry: 'index.js',
-  plugins: [
-    vue({
-      compileTemplate: true,
-      css (styles, stylesNodes) {
-        write('dist/papervue.styl', styles)
-        stylus.render(styles, function (err, css) {
-          if (err) throw err
-          write('dist/papervue.css', css)
-          write('dist/papervue.min.css', new CleanCSS().minify(css).styles)
-        })
-      }
-    }),
-    buble()
-  ]
+  plugins: [vue(), buble()]
 })
-  .then(function (bundle) {
+  .then(function(bundle) {
     var code = bundle.generate({
       format: 'umd',
       moduleName: 'helloRollupVue',
       useStrict: false
     }).code
-    return write('dist/papervue.js', code).then(function () {
+    return write('dist/papervue.js', code).then(function() {
       return code
     })
   })
-  .then(function (code) {
+  .then(function(code) {
     var minified = uglify.minify(code, {
       fromString: true,
       output: {
@@ -45,24 +31,24 @@ rollup({
   })
   .catch(logError)
 
-function write (dest, code) {
-  return new Promise(function (resolve, reject) {
-    fs.writeFile(dest, code, function (err) {
+function write(dest, code) {
+  return new Promise(function(resolve, reject) {
+    fs.writeFile(dest, code, function(err) {
       if (err) return reject(err)
       console.log(blue(dest) + ' ' + getSize(code))
       resolve()
     })
   })
 }
 
-function getSize (code) {
+function getSize(code) {
   return (code.length / 1024).toFixed(2) + 'kb'
 }
 
-function logError (e) {
+function logError(e) {
   console.log(e)
 }
 
-function blue (str) {
+function blue(str) {
   return '\x1b[1m\x1b[34m' + str + '\x1b[39m\x1b[22m'
 }