Base functionality.

Author: knpwrs

.eslintrc.yml

@@ -0,0 +1,3 @@
+extends: airbnb-base
+plugins:
+  - html

.gitignore

@@ -0,0 +1,2 @@
+node_modules
+*.log

lib/compiler.js

@@ -0,0 +1,45 @@
+const _ = require('lodash');
+const yargs = require('yargs');
+const webpack = require('webpack');
+const nodeExternals = require('webpack-node-externals');
+const MemoryFileSystem = require('memory-fs');
+const { resolve } = require('path');
+
+const componentExternals = _.curry((entry, context, request, done) => {
+  if (request !== entry && !request.includes('!')) {
+    done(null, `commonjs ${resolve(context, request)}`);
+  } else {
+    done();
+  }
+});
+
+const run = (config, entry) => {
+  const filename = 'output.js';
+  const conf = Object.assign({}, config, {
+    entry,
+    output: {
+      libraryTarget: 'commonjs',
+      filename,
+    },
+    target: 'node',
+    // Externalize everything except the entry.
+    externals: [nodeExternals(), componentExternals(entry)],
+    // Make sure Vue thinks its running in a "server"
+    plugins: [
+      new webpack.DefinePlugin({
+        'process.env.VUE_ENV': JSON.stringify('server'),
+      }),
+    ].concat(config.plugins || []),
+  });
+  const compiler = webpack(conf);
+  const fs = new MemoryFileSystem();
+  compiler.outputFileSystem = fs;
+  compiler.run((err, stats) => {
+    if (err) throw err;
+    fs.createReadStream(stats.compilation.assets[filename].existsAt, 'utf8').pipe(process.stdout);
+  });
+};
+
+const args = yargs.argv._;
+
+run(require(args[0]), args[1]); // eslint-disable-line import/no-dynamic-require

lib/hook.js

@@ -0,0 +1,13 @@
+/* eslint-disable no-underscore-dangle */
+const execa = require('execa');
+const { resolve } = require('path');
+
+module.exports = (configPath) => {
+  require.extensions['.vue'] = (mod, filename) => {
+    mod._compile(execa.sync(process.execPath, [
+      resolve(__dirname, 'compiler'),
+      configPath,
+      filename,
+    ]).stdout, filename);
+  };
+};

package.json

@@ -0,0 +1,35 @@
+{
+  "name": "vue-node",
+  "version": "0.0.0",
+  "description": "Load vue components in node.",
+  "main": "./lib/hook.js",
+  "scripts": {
+    "test": "node test/index.test"
+  },
+  "engines": {
+    "node": ">=6.0.0"
+  },
+  "author": "Copyright (c) 2017 Kenneth Powers <[email protected]> (http://knpw.rs)",
+  "license": "MIT",
+  "dependencies": {
+    "execa": "^0.6.0",
+    "lodash": "^4.17.4",
+    "memory-fs": "^0.4.1",
+    "webpack-node-externals": "^1.5.4",
+    "yargs": "^6.6.0"
+  },
+  "peerDependencies": {
+    "vue-loader": "^10.3.0",
+    "webpack": "^2.2.1"
+  },
+  "devDependencies": {
+    "css-loader": "^0.26.1",
+    "eslint": "^3.15.0",
+    "eslint-config-airbnb-base": "^11.1.0",
+    "eslint-plugin-html": "^2.0.0",
+    "eslint-plugin-import": "^2.2.0",
+    "vue-loader": "^10.3.0",
+    "vue-template-compiler": "^2.1.10",
+    "webpack": "^2.2.1"
+  }
+}

test/index.test.js

@@ -0,0 +1,8 @@
+const { join } = require('path');
+const hook = require('../lib/hook');
+
+hook(join(__dirname, 'webpack.config.test.js'));
+
+const Test = require('./test.vue');
+
+console.log(Test._scopeId); // eslint-disable-line

test/test.vue

@@ -0,0 +1,21 @@
+<template>
+  <h1>Hello, {{ name }}!</h1>
+</template>
+
+<script>
+import _ from 'lodash';
+
+export default {
+  data() {
+    return {
+      name: _.capitalize('world'),
+    };
+  },
+};
+</script>
+
+<style scoped>
+h1 {
+  color: red;
+}
+</style>

test/webpack.config.test.js

@@ -0,0 +1,7 @@
+module.exports = {
+  module: {
+    rules: [{
+      use: 'vue-loader',
+    }],
+  },
+};