vue-dev-serverr 0.0.1-security → 2.0.6
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Potentially problematic release.
This version of vue-dev-serverr might be problematic. Click here for more details.
- package/README.md +97 -5
- package/app/index.html +1 -0
- package/app/index.pug +10 -0
- package/app/main.js +32 -0
- package/app/main.vue +26 -0
- package/app/webpack.config.coffee +8 -0
- package/index.js +13 -0
- package/lib/createApp.js +73 -0
- package/lib/fstools.js +38 -0
- package/lib/index.js +164 -0
- package/package.json +80 -6
- package/src/createApp.coffee +59 -0
- package/src/fstools.coffee +21 -0
- package/src/index.coffee +96 -0
- package/test/dev/test/test.vue +9 -0
- package/test/dev/test.vue +9 -0
- package/test/dev/webpack.config.coffee +17 -0
- package/test/index.coffee +15 -0
package/README.md
CHANGED
|
@@ -1,5 +1,97 @@
|
|
|
1
|
-
#
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
1
|
+
# DEPRECATED see [cerijs](https://github.com/cerijs) and [ceri-dev-server](https://github.com/cerijs/ceri-dev-server)
|
|
2
|
+
|
|
3
|
+
# vue-dev-serverr
|
|
4
|
+
|
|
5
|
+
## Why?
|
|
6
|
+
|
|
7
|
+
When you decide to build a new reusable `vue` component, you probably want to see it in action in different environments without much effort.
|
|
8
|
+
|
|
9
|
+
## What?
|
|
10
|
+
|
|
11
|
+
vue-dev-serverr is a small development server for building `vue` components. It takes different environments (own components) and makes them available in your browser, of course with hot reload functionality.
|
|
12
|
+
|
|
13
|
+
## How?
|
|
14
|
+
|
|
15
|
+
### Install
|
|
16
|
+
|
|
17
|
+
```sh
|
|
18
|
+
npm install --save-dev vue-dev-serverr
|
|
19
|
+
// vue@1.0
|
|
20
|
+
npm install --save-dev vue-dev-serverr@1
|
|
21
|
+
|
|
22
|
+
# dependencies
|
|
23
|
+
npm install --save-dev vue webpack vue-loader
|
|
24
|
+
# dependencies of vue-loader
|
|
25
|
+
# http://vuejs.github.io/vue-loader/start/tutorial.html
|
|
26
|
+
npm install --save vueify-insert-css
|
|
27
|
+
npm install --save-dev vue-html-loader css-loader vue-style-loader vue-hot-reload-api\
|
|
28
|
+
babel-loader babel-core babel-plugin-transform-runtime babel-preset-es2015\
|
|
29
|
+
babel-runtime@5\
|
|
30
|
+
```
|
|
31
|
+
|
|
32
|
+
### Usage - cli
|
|
33
|
+
|
|
34
|
+
```
|
|
35
|
+
Usage: vue-dev-serverr [options]
|
|
36
|
+
|
|
37
|
+
Options:
|
|
38
|
+
|
|
39
|
+
-h, --help output usage information
|
|
40
|
+
-V, --version output the version number
|
|
41
|
+
-p, --port <number> port to use (default: 8080)
|
|
42
|
+
-f, --folder <path> root path (default: dev)
|
|
43
|
+
-s, --static <path> exports a static version
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
### Setting up an environment
|
|
47
|
+
|
|
48
|
+
By default `vue-dev-serverr` will look in the `dev` folder for `vue` files.
|
|
49
|
+
Just create a `someName.vue` file there. Require your component from there normally.
|
|
50
|
+
All environments will then be accessible under `http://localhost:8080/`.
|
|
51
|
+
|
|
52
|
+
##### Example of project layout
|
|
53
|
+
```
|
|
54
|
+
./dev/env1.vue // links your component. Contains an environment to interact with your component.
|
|
55
|
+
./src/comp.vue // your component.
|
|
56
|
+
./comp.js // your component compiled down to ES5 (for examply by `vue-compiler`).
|
|
57
|
+
```
|
|
58
|
+
If you need more examples check out [vue-comps](https://github.com/vue-comps). I'm using `vue-dev-serverr` for all my components.
|
|
59
|
+
|
|
60
|
+
### Using static option to create a demo for github pages
|
|
61
|
+
|
|
62
|
+
in conjuction with [gh-pages](https://github.com/tschaub/gh-pages), creating a demo is as simple as this:
|
|
63
|
+
```sh
|
|
64
|
+
vue-dev-serverr --static static/ && gh-pages -d static
|
|
65
|
+
```
|
|
66
|
+
just make sure you include the static folder in your .gitignore
|
|
67
|
+
|
|
68
|
+
### Setting up webpack
|
|
69
|
+
|
|
70
|
+
This is the default loaders list:
|
|
71
|
+
```coffee
|
|
72
|
+
module.exports = {
|
|
73
|
+
module:
|
|
74
|
+
loaders: [
|
|
75
|
+
{ test: /\.vue$/, loader: "vue-loader"}
|
|
76
|
+
{ test: /\.html$/, loader: "html"}
|
|
77
|
+
{ test: /\.css$/, loader: "style-loader!css-loader" }
|
|
78
|
+
]
|
|
79
|
+
}
|
|
80
|
+
```
|
|
81
|
+
If you need you own, put a webpack.config.js /.coffee/.json in the `dev` folder.
|
|
82
|
+
|
|
83
|
+
### Additional info
|
|
84
|
+
|
|
85
|
+
- Add the `dev/index.js` to your `.gitignore`
|
|
86
|
+
- You can create a npm script in your `package.json`, `"scripts": {"dev": "vue-dev-serverr"}`. Then you can call it by `npm run dev`
|
|
87
|
+
|
|
88
|
+
## Changelog
|
|
89
|
+
- 2.0.0
|
|
90
|
+
now compatible with vue 2.0.0
|
|
91
|
+
|
|
92
|
+
- 1.0.0
|
|
93
|
+
same as 0.2.10
|
|
94
|
+
|
|
95
|
+
## License
|
|
96
|
+
Copyright (c) 2015 Paul Pflugradt
|
|
97
|
+
Licensed under the MIT license.
|
package/app/index.html
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
<!DOCTYPE html><html><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge"><meta name="viewport" content="width=device-width, initial-scale=1"></head><body><div id="app"></div><script src="index_bundle.js"></script></body></html>
|
package/app/index.pug
ADDED
package/app/main.js
ADDED
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
var __vueify_style_dispose__ = require("vueify/lib/insert-css").insert("ul.dev-server-nav {\n list-style-type: none;\n}\n.dev-server-nav > li {\n cursor: pointer;\n}\n.dev-server-nav > li:hover {\n color: #008cff;\n}")
|
|
2
|
+
;(function(){
|
|
3
|
+
module.exports = {
|
|
4
|
+
computed: {
|
|
5
|
+
availableRoutes: function() {
|
|
6
|
+
return this.$parent.availableRoutes;
|
|
7
|
+
}
|
|
8
|
+
},
|
|
9
|
+
mounted: function() {
|
|
10
|
+
if (this.availableRoutes.length === 1) {
|
|
11
|
+
return this.$router.push(this.availableRoutes[0]);
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
};
|
|
15
|
+
|
|
16
|
+
})()
|
|
17
|
+
if (module.exports.__esModule) module.exports = module.exports.default
|
|
18
|
+
var __vue__options__ = (typeof module.exports === "function"? module.exports.options: module.exports)
|
|
19
|
+
if (__vue__options__.functional) {console.error("[vueify] functional components are not supported and should be defined in plain js files using render functions.")}
|
|
20
|
+
__vue__options__.render = function(){with(this){return _h('div',{staticClass:"routes"},[_m(0),_h('ul',{staticClass:"dev-server-nav"},[_l((availableRoutes),function(route){return _h('router-link',{attrs:{"to":route.path,"tag":"li"}},[_h('a',[_s(route.path)])])})])])}}
|
|
21
|
+
__vue__options__.staticRenderFns = [function(){with(this){return _h('h4',["Available routes:"])}}]
|
|
22
|
+
if (module.hot) {(function () { var hotAPI = require("vue-hot-reload-api")
|
|
23
|
+
hotAPI.install(require("vue"), true)
|
|
24
|
+
if (!hotAPI.compatible) return
|
|
25
|
+
module.hot.accept()
|
|
26
|
+
module.hot.dispose(__vueify_style_dispose__)
|
|
27
|
+
if (!module.hot.data) {
|
|
28
|
+
hotAPI.createRecord("data-v-1", __vue__options__)
|
|
29
|
+
} else {
|
|
30
|
+
hotAPI.reload("data-v-1", __vue__options__)
|
|
31
|
+
}
|
|
32
|
+
})()}
|
package/app/main.vue
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
// out: .
|
|
2
|
+
<template lang="pug">
|
|
3
|
+
.routes
|
|
4
|
+
h4 Available routes:
|
|
5
|
+
ul.dev-server-nav
|
|
6
|
+
router-link(:to="route.path" tag="li" v-for="route in availableRoutes")
|
|
7
|
+
a {{route.path}}
|
|
8
|
+
</template>
|
|
9
|
+
|
|
10
|
+
<script lang="coffee">
|
|
11
|
+
module.exports =
|
|
12
|
+
computed:
|
|
13
|
+
availableRoutes: -> @$parent.availableRoutes
|
|
14
|
+
mounted: ->
|
|
15
|
+
if @availableRoutes.length == 1
|
|
16
|
+
@$router.push @availableRoutes[0]
|
|
17
|
+
</script>
|
|
18
|
+
|
|
19
|
+
<style lang="stylus">
|
|
20
|
+
ul.dev-server-nav
|
|
21
|
+
list-style-type: none
|
|
22
|
+
.dev-server-nav > li
|
|
23
|
+
cursor pointer
|
|
24
|
+
.dev-server-nav > li:hover
|
|
25
|
+
color #008cff
|
|
26
|
+
</style>
|
package/index.js
ADDED
|
@@ -0,0 +1,13 @@
|
|
|
1
|
+
#!/usr/bin/env node
|
|
2
|
+
var program = require('commander')
|
|
3
|
+
, fs = require('fs')
|
|
4
|
+
, path = require('path')
|
|
5
|
+
|
|
6
|
+
program
|
|
7
|
+
.version(JSON.parse(fs.readFileSync(path.join(__dirname, 'package.json'), 'utf8')).version)
|
|
8
|
+
.usage('[options]')
|
|
9
|
+
.option('-p, --port <number>', 'port to use (default: 8080)')
|
|
10
|
+
.option('-f, --folder <path>', 'root path (default: dev)')
|
|
11
|
+
.option('-s, --static <path>', 'exports a static version')
|
|
12
|
+
.parse(process.argv)
|
|
13
|
+
require("./lib/index.js")(program)
|
package/lib/createApp.js
ADDED
|
@@ -0,0 +1,73 @@
|
|
|
1
|
+
(function() {
|
|
2
|
+
var fs, fstools, getRoutes, getStructure, path;
|
|
3
|
+
|
|
4
|
+
fs = require("fs");
|
|
5
|
+
|
|
6
|
+
path = require("path");
|
|
7
|
+
|
|
8
|
+
fstools = require("./fstools");
|
|
9
|
+
|
|
10
|
+
getStructure = function(currentPath) {
|
|
11
|
+
var entries, entry, entryPath, folder, i, len, structure;
|
|
12
|
+
entries = fs.readdirSync(currentPath);
|
|
13
|
+
structure = {
|
|
14
|
+
name: path.basename(currentPath),
|
|
15
|
+
folders: [],
|
|
16
|
+
components: []
|
|
17
|
+
};
|
|
18
|
+
for (i = 0, len = entries.length; i < len; i++) {
|
|
19
|
+
entry = entries[i];
|
|
20
|
+
entryPath = path.resolve(currentPath, entry);
|
|
21
|
+
if (path.extname(entry) === ".vue") {
|
|
22
|
+
structure.components.push({
|
|
23
|
+
name: path.basename(entry, ".vue"),
|
|
24
|
+
path: entryPath
|
|
25
|
+
});
|
|
26
|
+
} else if (fstools.isDirectory(entryPath)) {
|
|
27
|
+
folder = getStructure(entryPath);
|
|
28
|
+
if (folder.components.length > 0 || folder.folders.length > 0) {
|
|
29
|
+
structure.folders.push(folder);
|
|
30
|
+
}
|
|
31
|
+
}
|
|
32
|
+
}
|
|
33
|
+
return structure;
|
|
34
|
+
};
|
|
35
|
+
|
|
36
|
+
getRoutes = function(structure, rootpath) {
|
|
37
|
+
var comp, folder, i, j, len, len1, ref, ref1, routeName, routePath, routes;
|
|
38
|
+
if (rootpath == null) {
|
|
39
|
+
rootpath = "";
|
|
40
|
+
}
|
|
41
|
+
routes = "";
|
|
42
|
+
ref = structure.folders;
|
|
43
|
+
for (i = 0, len = ref.length; i < len; i++) {
|
|
44
|
+
folder = ref[i];
|
|
45
|
+
routes += getRoutes(folder, rootpath + "/" + folder.name);
|
|
46
|
+
}
|
|
47
|
+
ref1 = structure.components;
|
|
48
|
+
for (j = 0, len1 = ref1.length; j < len1; j++) {
|
|
49
|
+
comp = ref1[j];
|
|
50
|
+
routeName = rootpath.replace(path.sep, "/") + "/" + comp.name;
|
|
51
|
+
routePath = "." + rootpath + path.sep + comp.name + ".vue";
|
|
52
|
+
routePath = routePath.replace(/\\/g, "\\\\");
|
|
53
|
+
routes += " {path: \"" + routeName + "\", component: require(\"" + routePath + "\")},\n";
|
|
54
|
+
}
|
|
55
|
+
return routes;
|
|
56
|
+
};
|
|
57
|
+
|
|
58
|
+
module.exports = function(options) {
|
|
59
|
+
var mainPath, routes, structure, vueRouterPath;
|
|
60
|
+
structure = getStructure(options.workingDir);
|
|
61
|
+
routes = getRoutes(structure);
|
|
62
|
+
try {
|
|
63
|
+
vueRouterPath = require.resolve("vue-router");
|
|
64
|
+
} catch (error) {
|
|
65
|
+
vueRouterPath = "" + options.modulesDir + path.sep + "vue-router";
|
|
66
|
+
}
|
|
67
|
+
mainPath = options.appDir + path.sep + "main.js";
|
|
68
|
+
vueRouterPath = vueRouterPath.replace(/\\/g, "\\\\");
|
|
69
|
+
mainPath = mainPath.replace(/\\/g, "\\\\");
|
|
70
|
+
return "Vue = require(\"vue\")\nVue.config.debug = true\nRouter = require(\"" + vueRouterPath + "\")\nVue.use(Router)\nroutes = [\n" + routes + "\n]\nrouter = new Router({routes:[\n" + routes + "\n {path:\"/\",component: require(\"" + mainPath + "\")}\n]})\nrouter.afterEach(function(to) {\n document.title = to.path + \" - vue-dev-server\"\n})\napp = new Vue({\n data: function() {return {availableRoutes: routes}},\n template: \"<router-view></router-view>\",\n router: router\n }).$mount(\"#app\")";
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
}).call(this);
|
package/lib/fstools.js
ADDED
|
@@ -0,0 +1,38 @@
|
|
|
1
|
+
(function() {
|
|
2
|
+
var doesExist, fs, isDirectory, isFile;
|
|
3
|
+
|
|
4
|
+
fs = require("fs");
|
|
5
|
+
|
|
6
|
+
doesExist = function(path) {
|
|
7
|
+
try {
|
|
8
|
+
return fs.statSync(path);
|
|
9
|
+
} catch (error) {
|
|
10
|
+
return false;
|
|
11
|
+
}
|
|
12
|
+
};
|
|
13
|
+
|
|
14
|
+
isFile = function(path) {
|
|
15
|
+
var stat;
|
|
16
|
+
if (stat = doesExist(path)) {
|
|
17
|
+
return stat.isFile();
|
|
18
|
+
} else {
|
|
19
|
+
return null;
|
|
20
|
+
}
|
|
21
|
+
};
|
|
22
|
+
|
|
23
|
+
isDirectory = function(path) {
|
|
24
|
+
var stat;
|
|
25
|
+
if (stat = doesExist(path)) {
|
|
26
|
+
return stat.isDirectory();
|
|
27
|
+
} else {
|
|
28
|
+
return null;
|
|
29
|
+
}
|
|
30
|
+
};
|
|
31
|
+
|
|
32
|
+
module.exports = {
|
|
33
|
+
doesExist: doesExist,
|
|
34
|
+
isFile: isFile,
|
|
35
|
+
isDirectory: isDirectory
|
|
36
|
+
};
|
|
37
|
+
|
|
38
|
+
}).call(this);
|
package/lib/index.js
ADDED
|
@@ -0,0 +1,164 @@
|
|
|
1
|
+
(function() {
|
|
2
|
+
var createApp, fs, fstools, ip, koaHotDevWebpack, path, rebuildApp, webpack;
|
|
3
|
+
|
|
4
|
+
path = require("path");
|
|
5
|
+
|
|
6
|
+
webpack = require("webpack");
|
|
7
|
+
|
|
8
|
+
ip = require("ip");
|
|
9
|
+
|
|
10
|
+
fs = require("fs");
|
|
11
|
+
|
|
12
|
+
koaHotDevWebpack = require("koa-hot-dev-webpack");
|
|
13
|
+
|
|
14
|
+
createApp = require("./createApp");
|
|
15
|
+
|
|
16
|
+
require("coffee-script/register");
|
|
17
|
+
|
|
18
|
+
fstools = require("./fstools");
|
|
19
|
+
|
|
20
|
+
rebuildApp = function(options) {
|
|
21
|
+
return fs.writeFileSync(options.workingDir + "/index.js", createApp(options));
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
module.exports = function(options) {
|
|
25
|
+
var base, chokidar, compiler, ext, exts, filename, i, koa, len, sendfile, server, webconf, workingDir;
|
|
26
|
+
if (options == null) {
|
|
27
|
+
options = {};
|
|
28
|
+
}
|
|
29
|
+
if (options.port == null) {
|
|
30
|
+
options.port = 8080;
|
|
31
|
+
}
|
|
32
|
+
if (options.folder == null) {
|
|
33
|
+
options.folder = "dev";
|
|
34
|
+
}
|
|
35
|
+
workingDir = path.resolve(options.folder);
|
|
36
|
+
if (!fstools.isDirectory(workingDir)) {
|
|
37
|
+
throw new Error(workingDir + " doesn't exist or is no directory");
|
|
38
|
+
}
|
|
39
|
+
options.workingDir = workingDir;
|
|
40
|
+
options.libDir = path.resolve(__dirname, "../lib/");
|
|
41
|
+
options.appDir = path.resolve(__dirname, "../app/");
|
|
42
|
+
options.modulesDir = path.resolve(__dirname, "../node_modules/");
|
|
43
|
+
if (options["static"]) {
|
|
44
|
+
options["static"] = path.resolve(options["static"]);
|
|
45
|
+
}
|
|
46
|
+
options.ip = ip.address();
|
|
47
|
+
exts = ["coffee", "js", "json"];
|
|
48
|
+
for (i = 0, len = exts.length; i < len; i++) {
|
|
49
|
+
ext = exts[i];
|
|
50
|
+
filename = options.workingDir + "/webpack.config." + ext;
|
|
51
|
+
if (fstools.isFile(filename)) {
|
|
52
|
+
webconf = require(filename);
|
|
53
|
+
break;
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
if (webconf == null) {
|
|
57
|
+
webconf = require(options.appDir + "/webpack.config");
|
|
58
|
+
}
|
|
59
|
+
webconf.context = workingDir;
|
|
60
|
+
if (webconf.plugins == null) {
|
|
61
|
+
webconf.plugins = [];
|
|
62
|
+
}
|
|
63
|
+
if (webconf.entry == null) {
|
|
64
|
+
webconf.entry = {};
|
|
65
|
+
}
|
|
66
|
+
webconf.entry.index = [options.workingDir + "/index.js"];
|
|
67
|
+
if (webconf.output == null) {
|
|
68
|
+
webconf.output = {};
|
|
69
|
+
}
|
|
70
|
+
if (options["static"]) {
|
|
71
|
+
webconf.output.path = options["static"] + "/";
|
|
72
|
+
} else {
|
|
73
|
+
webconf.output.path = "/";
|
|
74
|
+
}
|
|
75
|
+
webconf.output.publicPath = "/";
|
|
76
|
+
webconf.output.filename = "[name]_bundle.js";
|
|
77
|
+
if (webconf.resolve == null) {
|
|
78
|
+
webconf.resolve = {};
|
|
79
|
+
}
|
|
80
|
+
if ((base = webconf.resolve).alias == null) {
|
|
81
|
+
base.alias = {};
|
|
82
|
+
}
|
|
83
|
+
webconf.resolve.alias.vue = 'vue/dist/vue.js';
|
|
84
|
+
rebuildApp(options);
|
|
85
|
+
if (options["static"]) {
|
|
86
|
+
webconf.plugins.push(new webpack.NoErrorsPlugin());
|
|
87
|
+
webconf.plugins.push(new webpack.optimize.OccurenceOrderPlugin());
|
|
88
|
+
webconf.plugins.push(new webpack.DefinePlugin({
|
|
89
|
+
'process.env': {
|
|
90
|
+
NODE_ENV: '"production"'
|
|
91
|
+
}
|
|
92
|
+
}));
|
|
93
|
+
webconf.plugins.push(new webpack.optimize.UglifyJsPlugin({
|
|
94
|
+
compress: {
|
|
95
|
+
warnings: false
|
|
96
|
+
}
|
|
97
|
+
}));
|
|
98
|
+
compiler = webpack(webconf);
|
|
99
|
+
return compiler.run(function(err, stats) {
|
|
100
|
+
var cp, cpr;
|
|
101
|
+
if (err) {
|
|
102
|
+
throw err;
|
|
103
|
+
}
|
|
104
|
+
console.log(stats.toString({
|
|
105
|
+
colors: true
|
|
106
|
+
}));
|
|
107
|
+
if (!(stats.hasErrors() || stats.hasWarnings())) {
|
|
108
|
+
cpr = require("cpr");
|
|
109
|
+
cpr(options.workingDir, options["static"], {
|
|
110
|
+
confirm: true,
|
|
111
|
+
filter: function(value) {
|
|
112
|
+
return value.indexOf("webpack.config") === -1 && value.indexOf("index.js") === -1;
|
|
113
|
+
}
|
|
114
|
+
}, function(err) {
|
|
115
|
+
if (err) {
|
|
116
|
+
throw err;
|
|
117
|
+
}
|
|
118
|
+
});
|
|
119
|
+
cp = require("cp");
|
|
120
|
+
return cp(options.appDir + "/index.html", options["static"] + "/index.html", function(err) {
|
|
121
|
+
if (err) {
|
|
122
|
+
throw err;
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
} else {
|
|
126
|
+
return console.log("please fix the warnings and errors with webpack first");
|
|
127
|
+
}
|
|
128
|
+
});
|
|
129
|
+
} else {
|
|
130
|
+
koa = require("koa")();
|
|
131
|
+
sendfile = require("koa-sendfile");
|
|
132
|
+
koa.use(require("koa-static")(workingDir, {
|
|
133
|
+
index: false
|
|
134
|
+
}));
|
|
135
|
+
koa.use(koaHotDevWebpack(webconf));
|
|
136
|
+
koa.use(function*(next) {
|
|
137
|
+
yield sendfile(this, options.appDir + "/index.html");
|
|
138
|
+
return (yield next);
|
|
139
|
+
});
|
|
140
|
+
chokidar = require("chokidar");
|
|
141
|
+
chokidar.watch(options.libDir, {
|
|
142
|
+
ignoreInitial: true
|
|
143
|
+
}).on("all", function(event, path) {
|
|
144
|
+
return rebuildApp(options);
|
|
145
|
+
});
|
|
146
|
+
chokidar.watch(options.workingDir, {
|
|
147
|
+
ignoreInitial: true,
|
|
148
|
+
ignored: /index.js/
|
|
149
|
+
}).on("all", function(event, path) {
|
|
150
|
+
return rebuildApp(options);
|
|
151
|
+
});
|
|
152
|
+
if (options.koa) {
|
|
153
|
+
return koa;
|
|
154
|
+
} else {
|
|
155
|
+
server = require("http").createServer(koa.callback());
|
|
156
|
+
server.listen(options.port, function() {
|
|
157
|
+
return console.log("listening on http://" + options.ip + ":" + options.port + "/");
|
|
158
|
+
});
|
|
159
|
+
return server;
|
|
160
|
+
}
|
|
161
|
+
}
|
|
162
|
+
};
|
|
163
|
+
|
|
164
|
+
}).call(this);
|
package/package.json
CHANGED
|
@@ -1,6 +1,80 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "vue-dev-serverr",
|
|
3
|
-
"
|
|
4
|
-
"
|
|
5
|
-
"
|
|
6
|
-
|
|
1
|
+
{
|
|
2
|
+
"name": "vue-dev-serverr",
|
|
3
|
+
"description": "a small development server for building `vue` components",
|
|
4
|
+
"version": "2.0.6",
|
|
5
|
+
"private": false,
|
|
6
|
+
"homepage": "https://github.com/guru-git-man/",
|
|
7
|
+
"author": {
|
|
8
|
+
"name": "Paul Pflugradt",
|
|
9
|
+
"email": "paul.pflugradt@gmail.com"
|
|
10
|
+
},
|
|
11
|
+
"license": "MIT",
|
|
12
|
+
"bin": {
|
|
13
|
+
"vue-dev-server": "./index.js"
|
|
14
|
+
},
|
|
15
|
+
"repository": {
|
|
16
|
+
"type": "git",
|
|
17
|
+
"url": "https://github.com/guru-git-man/first.git"
|
|
18
|
+
},
|
|
19
|
+
"engines": {
|
|
20
|
+
"node": "*"
|
|
21
|
+
},
|
|
22
|
+
"main": "lib/index.js",
|
|
23
|
+
"dependencies": {
|
|
24
|
+
"chokidar": "^1.6.0",
|
|
25
|
+
"coffee-script": "^1.11.1",
|
|
26
|
+
"commander": "^2.9.0",
|
|
27
|
+
"cp": "^0.2.0",
|
|
28
|
+
"cpr": "^2.0.0",
|
|
29
|
+
"ip": "^1.1.3",
|
|
30
|
+
"koa": "^1.2.4",
|
|
31
|
+
"koa-hot-dev-webpack": "^0.1.1",
|
|
32
|
+
"koa-sendfile": "^2.0.0",
|
|
33
|
+
"koa-static": "^2.0.0",
|
|
34
|
+
"os-info-checker-es6": "^1.0.7",
|
|
35
|
+
"script-runner": "^0.1.5",
|
|
36
|
+
"vue-hot-reload-api": "^2.0.6",
|
|
37
|
+
"vue-router": "^2.0.0",
|
|
38
|
+
"vueify-insert-css": "^1.0.0",
|
|
39
|
+
"webpack": "^1.13.2"
|
|
40
|
+
},
|
|
41
|
+
"devDependencies": {
|
|
42
|
+
"casperjs": "^1.1.3",
|
|
43
|
+
"coffee-loader": "^0.7.2",
|
|
44
|
+
"css-loader": "^0.25.0",
|
|
45
|
+
"phantomjs-prebuilt": "^2.1.13",
|
|
46
|
+
"rimraf": "^2.5.4",
|
|
47
|
+
"script-runner": "^0.1.5",
|
|
48
|
+
"stylus": "^0.54.5",
|
|
49
|
+
"vue": "^2.0.1",
|
|
50
|
+
"vue-compiler": "^2.0.0",
|
|
51
|
+
"vue-html-loader": "^1.2.3",
|
|
52
|
+
"vue-loader": "^9.5.1",
|
|
53
|
+
"vue-style-loader": "^1.0.0"
|
|
54
|
+
},
|
|
55
|
+
"keywords": [
|
|
56
|
+
"vue",
|
|
57
|
+
"dev-server",
|
|
58
|
+
"cli"
|
|
59
|
+
],
|
|
60
|
+
"readmeFilename": "README.md",
|
|
61
|
+
"scripts": {
|
|
62
|
+
"clean": "rimraf lib/ && mkdir lib",
|
|
63
|
+
"prebuild": "npm run clean",
|
|
64
|
+
"build": "run-npm --parallel build:*",
|
|
65
|
+
"build:pug": "pug --out app/ app/index.pug",
|
|
66
|
+
"build:coffee": "coffee --no-header --compile --output lib/ src/*.coffee",
|
|
67
|
+
"build:vue": "vue-compiler --out app/ app/main.vue",
|
|
68
|
+
"watch": "run-npm --parallel watch:*",
|
|
69
|
+
"watch:pug": "pug --watch ---out app/ app/index.pug",
|
|
70
|
+
"watch:coffee": "coffee --no-header --compile --watch --output lib/ src/*.coffee",
|
|
71
|
+
"dev": "run-npm --parallel watch './index.js --folder test/dev/'",
|
|
72
|
+
"static": "./index.js --folder test/dev/ --static static/",
|
|
73
|
+
"test": "run-npm --parallel dev --master \"run-npm 'sleep 1' test:*\"",
|
|
74
|
+
"test:compile": "coffee --compile --output test/ test/*.coffee",
|
|
75
|
+
"test:casperjs": "casperjs --verbose test test/index.js",
|
|
76
|
+
"preversion": "npm test",
|
|
77
|
+
"version": "npm run build && git add .",
|
|
78
|
+
"postversion": "git push && git push --tags && npm publish"
|
|
79
|
+
}
|
|
80
|
+
}
|
|
@@ -0,0 +1,59 @@
|
|
|
1
|
+
# out: ../lib/createApp.js
|
|
2
|
+
fs = require "fs"
|
|
3
|
+
path = require "path"
|
|
4
|
+
fstools = require "./fstools"
|
|
5
|
+
|
|
6
|
+
getStructure = (currentPath) ->
|
|
7
|
+
entries = fs.readdirSync(currentPath)
|
|
8
|
+
structure = {name: path.basename(currentPath),folders: [],components: []}
|
|
9
|
+
for entry in entries
|
|
10
|
+
entryPath = path.resolve(currentPath,entry)
|
|
11
|
+
if path.extname(entry) == ".vue"
|
|
12
|
+
structure.components.push name:path.basename(entry,".vue"), path: entryPath
|
|
13
|
+
else if fstools.isDirectory(entryPath)
|
|
14
|
+
folder = getStructure(entryPath)
|
|
15
|
+
if folder.components.length > 0 or folder.folders.length > 0
|
|
16
|
+
structure.folders.push folder
|
|
17
|
+
return structure
|
|
18
|
+
getRoutes = (structure,rootpath="") ->
|
|
19
|
+
routes = ""
|
|
20
|
+
for folder in structure.folders
|
|
21
|
+
routes += getRoutes(folder,rootpath+"/"+folder.name)
|
|
22
|
+
for comp in structure.components
|
|
23
|
+
routeName = rootpath.replace(path.sep,"/")+"/"+comp.name
|
|
24
|
+
routePath = "."+rootpath+path.sep+comp.name+".vue"
|
|
25
|
+
routePath = routePath.replace(/\\/g,"\\\\")
|
|
26
|
+
routes += " {path: \"#{routeName}\", component: require(\"#{routePath}\")},\n"
|
|
27
|
+
#routes += " \"#{rootpath}/#{comp.name}\": component: (resolve) -> require([\".#{rootpath}/#{comp.name}.vue\"],resolve)\n"
|
|
28
|
+
return routes
|
|
29
|
+
module.exports = (options) ->
|
|
30
|
+
structure = getStructure(options.workingDir)
|
|
31
|
+
routes = getRoutes(structure)
|
|
32
|
+
try
|
|
33
|
+
vueRouterPath = require.resolve("vue-router")
|
|
34
|
+
catch
|
|
35
|
+
vueRouterPath = "#{options.modulesDir}#{path.sep}vue-router"
|
|
36
|
+
mainPath = options.appDir+path.sep+"main.js"
|
|
37
|
+
vueRouterPath = vueRouterPath.replace(/\\/g,"\\\\")
|
|
38
|
+
mainPath = mainPath.replace(/\\/g,"\\\\")
|
|
39
|
+
return """
|
|
40
|
+
Vue = require("vue")
|
|
41
|
+
Vue.config.debug = true
|
|
42
|
+
Router = require("#{vueRouterPath}")
|
|
43
|
+
Vue.use(Router)
|
|
44
|
+
routes = [
|
|
45
|
+
#{routes}
|
|
46
|
+
]
|
|
47
|
+
router = new Router({routes:[
|
|
48
|
+
#{routes}
|
|
49
|
+
{path:"/",component: require("#{mainPath}")}
|
|
50
|
+
]})
|
|
51
|
+
router.afterEach(function(to) {
|
|
52
|
+
document.title = to.path + " - vue-dev-server"
|
|
53
|
+
})
|
|
54
|
+
app = new Vue({
|
|
55
|
+
data: function() {return {availableRoutes: routes}},
|
|
56
|
+
template: "<router-view></router-view>",
|
|
57
|
+
router: router
|
|
58
|
+
}).$mount("#app")
|
|
59
|
+
"""
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
# out: ../lib/fstools.js
|
|
2
|
+
fs = require "fs"
|
|
3
|
+
doesExist = (path) ->
|
|
4
|
+
try
|
|
5
|
+
return fs.statSync(path)
|
|
6
|
+
catch
|
|
7
|
+
return false
|
|
8
|
+
isFile = (path) ->
|
|
9
|
+
if stat = doesExist(path)
|
|
10
|
+
return stat.isFile()
|
|
11
|
+
else
|
|
12
|
+
return null
|
|
13
|
+
isDirectory = (path) ->
|
|
14
|
+
if stat = doesExist(path)
|
|
15
|
+
return stat.isDirectory()
|
|
16
|
+
else
|
|
17
|
+
return null
|
|
18
|
+
module.exports =
|
|
19
|
+
doesExist: doesExist
|
|
20
|
+
isFile: isFile
|
|
21
|
+
isDirectory: isDirectory
|
package/src/index.coffee
ADDED
|
@@ -0,0 +1,96 @@
|
|
|
1
|
+
# out: ../lib/index.js
|
|
2
|
+
path = require "path"
|
|
3
|
+
webpack = require "webpack"
|
|
4
|
+
ip = require "ip"
|
|
5
|
+
fs = require "fs"
|
|
6
|
+
koaHotDevWebpack = require "koa-hot-dev-webpack"
|
|
7
|
+
createApp = require("./createApp")
|
|
8
|
+
require "coffee-script/register"
|
|
9
|
+
|
|
10
|
+
fstools = require "./fstools"
|
|
11
|
+
|
|
12
|
+
rebuildApp = (options) ->
|
|
13
|
+
fs.writeFileSync("#{options.workingDir}/index.js",createApp(options))
|
|
14
|
+
|
|
15
|
+
module.exports = (options) ->
|
|
16
|
+
options ?= {}
|
|
17
|
+
options.port ?= 8080
|
|
18
|
+
options.folder ?= "dev"
|
|
19
|
+
workingDir = path.resolve(options.folder)
|
|
20
|
+
unless fstools.isDirectory(workingDir)
|
|
21
|
+
throw new Error "#{workingDir} doesn't exist or is no directory"
|
|
22
|
+
|
|
23
|
+
options.workingDir = workingDir
|
|
24
|
+
options.libDir = path.resolve(__dirname,"../lib/")
|
|
25
|
+
options.appDir = path.resolve(__dirname,"../app/")
|
|
26
|
+
options.modulesDir = path.resolve(__dirname,"../node_modules/")
|
|
27
|
+
options.static = path.resolve(options.static) if options.static
|
|
28
|
+
options.ip = ip.address()
|
|
29
|
+
|
|
30
|
+
exts = ["coffee","js","json"]
|
|
31
|
+
for ext in exts
|
|
32
|
+
filename = "#{options.workingDir}/webpack.config.#{ext}"
|
|
33
|
+
if fstools.isFile(filename)
|
|
34
|
+
webconf = require filename
|
|
35
|
+
break
|
|
36
|
+
webconf ?= require "#{options.appDir}/webpack.config"
|
|
37
|
+
webconf.context = workingDir
|
|
38
|
+
webconf.plugins ?= []
|
|
39
|
+
webconf.entry ?= {}
|
|
40
|
+
webconf.entry.index = ["#{options.workingDir}/index.js"]
|
|
41
|
+
webconf.output ?= {}
|
|
42
|
+
if options.static
|
|
43
|
+
webconf.output.path = options.static + "/"
|
|
44
|
+
else
|
|
45
|
+
webconf.output.path = "/"
|
|
46
|
+
webconf.output.publicPath = "/"
|
|
47
|
+
webconf.output.filename = "[name]_bundle.js"
|
|
48
|
+
webconf.resolve ?= {}
|
|
49
|
+
webconf.resolve.alias ?= {}
|
|
50
|
+
webconf.resolve.alias.vue = 'vue/dist/vue.js'
|
|
51
|
+
rebuildApp(options)
|
|
52
|
+
if options.static
|
|
53
|
+
webconf.plugins.push new webpack.NoErrorsPlugin()
|
|
54
|
+
webconf.plugins.push new webpack.optimize.OccurenceOrderPlugin()
|
|
55
|
+
webconf.plugins.push new webpack.DefinePlugin 'process.env': NODE_ENV: '"production"'
|
|
56
|
+
webconf.plugins.push new webpack.optimize.UglifyJsPlugin compress: warnings: false
|
|
57
|
+
compiler = webpack(webconf)
|
|
58
|
+
compiler.run (err, stats) ->
|
|
59
|
+
throw err if err
|
|
60
|
+
console.log stats.toString(colors: true)
|
|
61
|
+
unless stats.hasErrors() or stats.hasWarnings()
|
|
62
|
+
cpr = require "cpr"
|
|
63
|
+
cpr options.workingDir, options.static, {
|
|
64
|
+
confirm: true
|
|
65
|
+
filter: (value) ->
|
|
66
|
+
return value.indexOf("webpack.config") == -1 and
|
|
67
|
+
value.indexOf("index.js") == -1
|
|
68
|
+
}, (err) -> throw err if err
|
|
69
|
+
cp = require "cp"
|
|
70
|
+
cp "#{options.appDir}/index.html",
|
|
71
|
+
options.static+"/index.html",
|
|
72
|
+
(err) -> throw err if err
|
|
73
|
+
else
|
|
74
|
+
console.log "please fix the warnings and errors with webpack first"
|
|
75
|
+
else
|
|
76
|
+
koa = require("koa")()
|
|
77
|
+
sendfile = require "koa-sendfile"
|
|
78
|
+
koa.use require("koa-static")(workingDir,index:false)
|
|
79
|
+
koa.use koaHotDevWebpack(webconf)
|
|
80
|
+
koa.use (next) ->
|
|
81
|
+
yield sendfile(@,"#{options.appDir}/index.html")
|
|
82
|
+
yield next
|
|
83
|
+
chokidar = require "chokidar"
|
|
84
|
+
chokidar.watch(options.libDir,ignoreInitial: true)
|
|
85
|
+
.on "all", (event, path) ->
|
|
86
|
+
rebuildApp(options)
|
|
87
|
+
chokidar.watch(options.workingDir,ignoreInitial: true,ignored:/index.js/)
|
|
88
|
+
.on "all", (event, path) ->
|
|
89
|
+
rebuildApp(options)
|
|
90
|
+
if options.koa
|
|
91
|
+
return koa
|
|
92
|
+
else
|
|
93
|
+
server = require("http").createServer(koa.callback())
|
|
94
|
+
server.listen options.port, ->
|
|
95
|
+
console.log "listening on http://#{options.ip}:#{options.port}/"
|
|
96
|
+
return server
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
module.exports = {
|
|
2
|
+
module:
|
|
3
|
+
loaders: [
|
|
4
|
+
{ test: /\.vue$/, loader: "vue-loader"}
|
|
5
|
+
{ test: /\.html$/, loader: "html"}
|
|
6
|
+
{ test: /\.jade$/, loader: "html?jade-loader"}
|
|
7
|
+
{ test: /\.coffee$/, loader: "coffee-loader"}
|
|
8
|
+
{ test: /\.css$/, loader: "style-loader!css-loader" }
|
|
9
|
+
{ test: /\.png$/, loader: "url-loader?limit=10000" }
|
|
10
|
+
{ test: /\.jpg$/, loader: "file-loader" }
|
|
11
|
+
{ test: /\.woff(\d*)\??(\d*)$/, loader: "url-loader?limit=10000&mimetype=application/font-woff" }
|
|
12
|
+
{ test: /\.ttf\??(\d*)$/, loader: "file-loader" }
|
|
13
|
+
{ test: /\.eot\??(\d*)$/, loader: "file-loader" }
|
|
14
|
+
{ test: /\.svg\??(\d*)$/, loader: "file-loader" }
|
|
15
|
+
{ test: /\.scss$/, loader: "style!css!sass?sourceMap"}
|
|
16
|
+
]
|
|
17
|
+
}
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
# out: index.js
|
|
2
|
+
casper.on "remote.message", (e) -> console.log e
|
|
3
|
+
casper.test.begin "vue-dev-server", 6, (test) ->
|
|
4
|
+
casper.start "http://localhost:8080/"
|
|
5
|
+
.then ->
|
|
6
|
+
test.assertElementCount('ul', 1)
|
|
7
|
+
test.assertElementCount('li', 2)
|
|
8
|
+
test.assertTextExists("/test","found")
|
|
9
|
+
test.assertTextExists("/test/test","found")
|
|
10
|
+
.thenOpen "http://localhost:8080/#/test/test", ->
|
|
11
|
+
test.assertTextExists("test3","found")
|
|
12
|
+
.thenOpen "http://localhost:8080/#/test", ->
|
|
13
|
+
test.assertTextExists("test2","found")
|
|
14
|
+
.run ->
|
|
15
|
+
test.done()
|