Skip to content
This repository was archived by the owner on Apr 1, 2019. It is now read-only.

Commit b44699a

Browse files
author
Walker Leite
committed
fix umd build, and add docs
1 parent 906e74e commit b44699a

File tree

4 files changed

+58
-14
lines changed

4 files changed

+58
-14
lines changed

README.md

Lines changed: 24 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -44,9 +44,31 @@ $ npm run test:watch
4444
$ npm run test:cov
4545
```
4646

47-
### Building to ./dist
47+
### Building
48+
49+
#### ES6 Modules / CommonJS
50+
51+
```bash
52+
$ npm run build
53+
```
54+
55+
```js
56+
import myCmp from 'dist/my-cmp';
57+
58+
Vue.component('my-cmp', myCmp);
59+
```
60+
61+
#### UMD
4862

4963
```bash
5064
$ npm run build
51-
$ npm run build:doc
65+
```
66+
67+
```html
68+
<script src="https://unpkg.com/vue" charset="utf-8"></script>
69+
<script src="./dist/my-cmp.min.js" charset="utf-8"></script>
70+
71+
<script type="text/javascript">
72+
Vue.component('my-cmp', window.MyCmp);
73+
</script>
5274
```

meta.js

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,12 @@ module.exports = {
2020
"label": "Author"
2121
}
2222
},
23+
"helpers": {
24+
camelcase: function(str) {
25+
return str.replace(/([\-_\s]+[a-z])|(^[a-z])/g, $1 => $1.toUpperCase())
26+
.replace(/[\-_\s]+/g, '')
27+
}
28+
},
2329
"complete": function(data, {logger}) {
2430
// Rename to be compatible with styleguide configuration
2531
const cmpDir = data.inPlace?'src/Component':path.resolve(data.destDirName, 'src/Component');

template/README.md

Lines changed: 27 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -4,16 +4,38 @@
44
55
# Usage
66

7+
## ES6 Modules / CommonJS
8+
9+
```bash
10+
$ npm run build
11+
```
12+
713
```js
8-
import Component from '{{name}}'
14+
import {{ camelcase name }} from 'dist/{{ name }}';
15+
16+
Vue.component('{{ name }}', {{ camelcase name }});
17+
```
918

10-
Vue.component('{{name}}', Component);
19+
```html
20+
<{{name}} text="Hello World!"></{{name}}>
1121
```
1222

13-
<{{name}} text="Hello World!"></{{name}}>
23+
## UMD
1424

15-
PS: You can also build to UMD with `npm run build:umd`, the component will be
16-
available in the window['{{name}}'] variable.
25+
```bash
26+
$ npm run build
27+
```
28+
29+
```html
30+
<{{name}} text="Hello World!"></{{name}}>
31+
32+
<script src="https://unpkg.com/vue" charset="utf-8"></script>
33+
<script src="./dist/{{ name }}.min.js" charset="utf-8"></script>
34+
35+
<script type="text/javascript">
36+
Vue.component('{{ name }}', window.{{ camelcase name }});
37+
</script>
38+
```
1739

1840
## Installation
1941

template/poi.config.js

Lines changed: 1 addition & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -3,12 +3,6 @@ const webpack = require('webpack');
33
const glob = require('glob').sync;
44
const {name} = require('./package.json');
55

6-
// converts my-component to MyComponent
7-
function camelCase (s) {
8-
return s.replace(/([\-_\s]+[a-z])|(^[a-z])/g, $1 => $1.toUpperCase())
9-
.replace(/[\-_\s]+/g, '')
10-
}
11-
126
module.exports = {
137
entry: glob('./src/**/*.vue'),
148
filename: {
@@ -23,5 +17,5 @@ module.exports = {
2317
frameworks: ['mocha', 'chai', 'phantomjs-shim'],
2418
})
2519
],
26-
moduleName: camelCase({{ name }})
20+
moduleName: {{ camelcase name }}
2721
};

0 commit comments

Comments
 (0)