Fix 97, Import files in less (#98)

* Add tests for import style

* Add parent directory to paths

* Fix import statement

Author: znck

src/style/index.js

@@ -2,7 +2,7 @@ import { writeFile, mkdirSync as mkdir, existsSync as exists } from 'fs'
 import { dirname, isAbsolute, resolve as resolvePath } from 'path'
 import compileCSS from './css'
 import compileSCSS from './scss'
-import compileLESS from './less'
+import compileLESS from './less/index'
 import compileSTYLUS from './stylus'
 
 const compilers = {

src/style/less.js

@@ -0,0 +1,27 @@
+import path from 'path'
+
+export default async function (style, options) {
+    const less = require('less')
+    const config = {
+        plugins: [],
+        paths: [],
+        sourceMap: {
+            sourceMapFullFilename: style.id,
+            sourceMapFileInline: false
+        },
+        ...options.less
+    }
+
+    config.paths.unshift(path.dirname(style.id))
+
+    const { css, map } = await less.render(
+          'data' in options.less ? `${options.less.data}\n${style.code}` : style.code, config
+    )
+
+    style.$compiled = {
+        code: css.toString(),
+        map: map.toString()
+    }
+
+    return style
+}

src/style/less/index.js

@@ -0,0 +1,3 @@
+.hello {
+  color: red;
+}

test/expects/import-less.css

@@ -0,0 +1,3 @@
+var importLess = { template: "<div class=\"hello\"></div>",};
+
+export default importLess;

test/expects/import-less.js

@@ -0,0 +1,2 @@
+.hello {
+  color: red; }

test/expects/import-scss.css

@@ -0,0 +1,3 @@
+var importScss = { template: "<div class=\"hello\"></div>",};
+
+export default importScss;

test/expects/import-scss.js

@@ -0,0 +1,11 @@
+<template>
+<div class="hello"></div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style lang="less">
+@import './some.less';
+</style>

test/fixtures/import-less.vue

@@ -0,0 +1,11 @@
+<template>
+<div class="hello"></div>
+</template>
+
+<script>
+export default {}
+</script>
+
+<style lang="scss">
+@import './some.scss';
+</style>

test/fixtures/import-scss.vue

@@ -0,0 +1,5 @@
+@var: red;
+
+.hello {
+  color: @var;
+}