feat(src): Add support of template and script src tags (#29)

* feat(src): Add support of template and script src tags

Close #28

* test(src): Add tests for src attribute support

Author: Toilal

lib/process.js

@@ -7,6 +7,8 @@ const compileBabel = require('./compilers/babel-compiler')
 const compileTypescript = require('./compilers/typescript-compiler')
 const compileCoffeeScript = require('./compilers/coffee-compiler')
 const extractPropsFromFunctionalTemplate = require('./extract-props')
+const fs = require('fs')
+const join = require('path').join
 
 const splitRE = /\r?\n/g
 
@@ -41,6 +43,10 @@ module.exports = function (src, path) {
 
   changePartsIfFunctional(parts)
 
+  if (parts.script && parts.script.src) {
+    parts.script.content = fs.readFileSync(join(path, '..', parts.script.src), 'utf8')
+  }
+
   const result = processScript(parts.script)
   const script = result.code
   const inputMap = result.sourceMap
@@ -53,6 +59,10 @@ module.exports = function (src, path) {
     ': module.exports)\n'
 
   if (parts.template) {
+    if (parts.template.src) {
+      parts.template.content = fs.readFileSync(join(path, '..', parts.template.src), 'utf8')
+    }
+
     const renderFunctions = compileTemplate(parts.template)
 
     output += '__vue__options__.render = ' + renderFunctions.render + '\n' +

test/Babel.spec.js

@@ -1,5 +1,6 @@
 import Vue from 'vue'
 import Basic from './resources/Basic.vue'
+import BasicSrc from './resources/BasicSrc.vue'
 import jestVue from '../vue-jest'
 import { resolve } from 'path'
 import {
@@ -20,6 +21,11 @@ test('processes .vue files', () => {
   expect(typeof vm.$el).toBe('object')
 })
 
+test('processes .vue files using src attributes', () => {
+  const vm = new Vue(BasicSrc).$mount()
+  expect(typeof vm.$el).toBe('object')
+})
+
 test('processes .vue files with default babel if there is no .babelrc', () => {
   const babelRcPath = resolve(__dirname, '../.babelrc')
   const tempPath = resolve(__dirname, '../.renamed')

test/resources/BasicSrc.html

@@ -0,0 +1,3 @@
+<div class="hello">
+  <h1 :class="headingClasses">{{ msg }}</h1>
+</div>

test/resources/BasicSrc.js

@@ -0,0 +1,23 @@
+export default {
+  name: 'basic',
+  computed: {
+    headingClasses: function headingClasses () {
+      return {
+        red: this.isCrazy,
+        blue: !this.isCrazy,
+        shadow: this.isCrazy
+      }
+    }
+  },
+  data: function data () {
+    return {
+      msg: 'Welcome to Your Vue.js App',
+      isCrazy: false
+    }
+  },
+  methods: {
+    toggleClass: function toggleClass () {
+      this.isCrazy = !this.isCrazy
+    }
+  }
+}

test/resources/BasicSrc.vue

@@ -0,0 +1,3 @@
+<template src="./BasicSrc.html"></template>
+
+<script src="./BasicSrc.js"></script>