diff --git a/template/.gitignore b/template/.gitignore index 8e41ba1..a5103f7 100644 --- a/template/.gitignore +++ b/template/.gitignore @@ -1,6 +1,8 @@ .DS_Store node_modules/ dist/ +cjs/ +umd/ styleguide/ npm-debug.log yarn-error.log diff --git a/template/README.md b/template/README.md index 645733b..a5b2be0 100644 --- a/template/README.md +++ b/template/README.md @@ -2,16 +2,26 @@ > {{ description }} -# Usage +## Installation -## ES6 Modules / CommonJS +### Using yarn -```bash -$ npm run build -``` +`yarn add {{ name }}` + +### Using npm + +`npm i --save {{ name }}` + +## Demo and Docs + +`npm run serve` + +## Usage + +### With [vue-loader](https://github.com/vuejs/vue-loader) or [vueify](https://github.com/vuejs/vueify) ```js -import {{ camelcase name }} from 'dist/{{ name }}'; +import {{ camelcase name }} from '{{ name }}.vue'; Vue.component('{{ name }}', {{ camelcase name }}); ``` @@ -20,36 +30,36 @@ Vue.component('{{ name }}', {{ camelcase name }}); <{{name}} text="Hello World!"> ``` -## UMD +### ES6 Modules / CommonJS + +```js +import {{ camelcase name }} from '{{ name }}/cjs/{{ name }}.min.js'; +import '{{ name }}/cjs/{{ name }}.min.css'; + +Vue.component('{{ name }}', {{ camelcase name }}); +``` -```bash -$ npm run build:umd +```html +<{{name}} text="Hello World!"> ``` +### UMD + ```html <{{name}} text="Hello World!"> - + + ``` -## Installation - -### Using yarn +## Build -`yarn add {{ name }}` - -### Using npm - -`npm i --save {{ name }}` - -## Demo and Docs - -`npm run serve` +Build configuration is located in the `poi.config.js` file, to build just run: `npm run build`, it will build to `cjs` and `umd` directories. ## Tests diff --git a/template/package.json b/template/package.json index 2eddb21..ed29aed 100644 --- a/template/package.json +++ b/template/package.json @@ -3,12 +3,11 @@ "version": "0.0.1", "description": "{{ description }}", "author": "{{ author }}", - "main": "dist/{{name}}.min.js", + "main": "src/{{name}}/{{name}}.vue", "license": "MIT", "scripts": { "lint": "eslint src/**/*.vue", - "build": "poi build --format cjs", - "build:umd": "poi build --format umd", + "build": "poi build --format cjs --dist cjs; poi build --format umd --dist umd", "build:doc": "vue-styleguidist build", "serve": "vue-styleguidist server", "test": "poi test", @@ -20,7 +19,8 @@ "component" ], "files": [ - "dist/" + "umd/", + "cjs/" ], "dependencies": { "vue": "^2.5.3" diff --git a/template/poi.config.js b/template/poi.config.js index 785b58b..28e2b98 100644 --- a/template/poi.config.js +++ b/template/poi.config.js @@ -7,6 +7,7 @@ module.exports = { entry: glob('./src/**/*.vue'), filename: { js: name + '.min.js', + css: name + '.min.css', }, sourceMap: true, html: false, diff --git a/template/src/Component/Component.vue b/template/src/Component/Component.vue index 725f9c4..5e8d42e 100644 --- a/template/src/Component/Component.vue +++ b/template/src/Component/Component.vue @@ -20,3 +20,7 @@ export default { }, } + + diff --git a/test.js b/test.js index b9336d9..49c275e 100644 --- a/test.js +++ b/test.js @@ -5,7 +5,7 @@ const commands = [ {cmd: './node_modules/.bin/vue', args: ['init', '.', 'test-cmp'], yes: true}, {cmd: 'npm', args: ['install'], cwd: 'test-cmp'}, {cmd: 'npm', args: ['run', 'lint'], cwd: 'test-cmp'}, - {cmd: 'npm', args: ['run', 'build:umd'], cwd: 'test-cmp'}, + {cmd: 'npm', args: ['run', 'build'], cwd: 'test-cmp'}, {cmd: 'npm', args: ['run', 'build:doc'], cwd: 'test-cmp'}, {cmd: 'npm', args: ['run', 'test'], cwd: 'test-cmp'}, {cmd: 'npm', args: ['run', 'test:cov'], cwd: 'test-cmp'}