├── .npmignore
├── .travis.yml
├── .gitignore
├── __tests__
    ├── .eslintrc
    ├── __snapshots__
    │   └── exampleComponent.test.js.snap
    └── exampleComponent.test.js
├── src
    ├── index.js
    └── components
    │   └── ExampleComponent.vue
├── CHANGELOG.md
├── docs
    ├── app.js
    ├── webpack.config.js
    └── index.html
├── .eslintrc
├── .babelrc
├── .editorconfig
├── webpack.config.js
├── webpack.base.js
├── LICENSE.md
├── package.json
└── README.md


/.npmignore:
--------------------------------------------------------------------------------
1 | .idea
2 | __tests__


--------------------------------------------------------------------------------
/.travis.yml:
--------------------------------------------------------------------------------
1 | language: node_js
2 | node_js:
3 |     - 'stable'
4 | 


--------------------------------------------------------------------------------
/.gitignore:
--------------------------------------------------------------------------------
1 | /dist
2 | node_modules
3 | npm-debug.log
4 | yarn.lock
5 | 


--------------------------------------------------------------------------------
/__tests__/.eslintrc:
--------------------------------------------------------------------------------
1 | {
2 |     "env": {
3 |         "jest": true
4 |     }
5 | }
6 | 


--------------------------------------------------------------------------------
/src/index.js:
--------------------------------------------------------------------------------
1 | export { default as ExampleComponent } from './components/ExampleComponent';
2 | 


--------------------------------------------------------------------------------
/CHANGELOG.md:
--------------------------------------------------------------------------------
1 | # Changelog
2 | 
3 | All notable changes to `package_name` will be documented in this file
4 | 
5 | ## 1.0.0
6 | - Initial release
7 | 


--------------------------------------------------------------------------------
/docs/app.js:
--------------------------------------------------------------------------------
1 | import Vue from 'vue';
2 | import { ExampleComponent } from '../src';
3 | 
4 | new Vue({
5 |     components: { ExampleComponent },
6 | 
7 |     el: '#app',
8 | });
9 | 


--------------------------------------------------------------------------------
/.eslintrc:
--------------------------------------------------------------------------------
 1 | {
 2 |     "extends": "spatie/vue",
 3 |     "parserOptions": {
 4 |         "ecmaVersion": 8
 5 |     },
 6 |     "env": {
 7 |         "browser": true,
 8 |         "node": true
 9 |     }
10 | }
11 | 


--------------------------------------------------------------------------------
/__tests__/__snapshots__/exampleComponent.test.js.snap:
--------------------------------------------------------------------------------
 1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
 2 | 
 3 | exports[`ExampleComponent can mount 1`] = `
 4 | "
 5 |             <div id=\\"app\\"><div>
 6 |     I am an example component
 7 | </div></div>
 8 |         "
 9 | `;
10 | 


--------------------------------------------------------------------------------
/src/components/ExampleComponent.vue:
--------------------------------------------------------------------------------
 1 | <template>
 2 |     <div>
 3 |         I am an example component
 4 |     </div>
 5 | </template>
 6 | 
 7 | <script>
 8 |     export default {
 9 |         props: {},
10 | 
11 |         data: () => ({}),
12 | 
13 |         computed: {},
14 |     };
15 | </script>
16 | 
17 | <style>
18 | </style>


--------------------------------------------------------------------------------
/.babelrc:
--------------------------------------------------------------------------------
 1 | {
 2 |   "presets": [
 3 |     ["env", {
 4 |       "targets": {
 5 |         "browsers": ["last 2 versions", "safari >= 7"]
 6 |       },
 7 |       "modules": "umd"
 8 |     }]
 9 |   ],
10 |   "plugins": [
11 |     "transform-object-rest-spread",
12 |     ["transform-runtime", {
13 |       "polyfill": false,
14 |       "regenerator": true
15 |     }]
16 |   ]
17 | }
18 | 


--------------------------------------------------------------------------------
/.editorconfig:
--------------------------------------------------------------------------------
 1 | ; This file is for unifying the coding style for different editors and IDEs.
 2 | ; More information at http://editorconfig.org
 3 | 
 4 | root = true
 5 | 
 6 | [*]
 7 | charset = utf-8
 8 | indent_size = 4
 9 | indent_style = space
10 | end_of_line = lf
11 | insert_final_newline = true
12 | trim_trailing_whitespace = true
13 | 
14 | [{package.json,*.scss,*.css}]
15 | indent_size = 2
16 | 
17 | [*.md]
18 | trim_trailing_whitespace = false
19 | 


--------------------------------------------------------------------------------
/webpack.config.js:
--------------------------------------------------------------------------------
 1 | const path = require('path');
 2 | const merge = require('webpack-merge');
 3 | 
 4 | module.exports = merge(require('./webpack.base'), {
 5 |     context: __dirname,
 6 | 
 7 |     entry: './src/index.js',
 8 | 
 9 |     output: {
10 |         path: path.resolve(__dirname, 'dist'),
11 |         filename: 'index.js',
12 |         library: 'package_name',
13 |         libraryTarget: 'umd',
14 |     },
15 | 
16 |     externals: {
17 |         vue: 'vue',
18 |     },
19 | });
20 | 


--------------------------------------------------------------------------------
/webpack.base.js:
--------------------------------------------------------------------------------
 1 | module.exports = {
 2 |     module: {
 3 |         rules: [
 4 |             {
 5 |                 test: /\.js/,
 6 |                 loader: 'babel-loader',
 7 |                 exclude: /node_modules/,
 8 |             },
 9 |             {
10 |                 test: /\.vue$/,
11 |                 loader: 'vue-loader',
12 |                 exclude: /node_modules/,
13 |             },
14 |         ],
15 |     },
16 | 
17 |     resolve: {
18 |         extensions: ['.js', '.vue'],
19 |     },
20 | };
21 | 


--------------------------------------------------------------------------------
/docs/webpack.config.js:
--------------------------------------------------------------------------------
 1 | const path = require('path');
 2 | const merge = require('webpack-merge');
 3 | 
 4 | module.exports = merge(require('../webpack.base'), {
 5 |     context: __dirname,
 6 | 
 7 |     entry: './app.js',
 8 | 
 9 |     output: {
10 |         path: path.resolve(__dirname, 'build'),
11 |         filename: 'app.js',
12 |         publicPath: '/build/',
13 |     },
14 | 
15 |     resolve: {
16 |         alias: {
17 |             vue: 'vue/dist/vue.js',
18 |         },
19 |     },
20 | 
21 |     devServer: {
22 |         contentBase: __dirname,
23 |         port: 2000,
24 |     },
25 | });
26 | 


--------------------------------------------------------------------------------
/__tests__/exampleComponent.test.js:
--------------------------------------------------------------------------------
 1 | import { ExampleComponent } from '../src';
 2 | import Vue from 'vue/dist/vue.js';
 3 | 
 4 | describe('ExampleComponent', () => {
 5 |     Vue.component('example-component', ExampleComponent);
 6 | 
 7 |     beforeEach(() => {
 8 |         document.body.innerHTML = `
 9 |             <div id="app">
10 |                 <example-component></example-component>
11 |             </div>
12 |         `;
13 |     });
14 | 
15 |     it('can mount', async () => {
16 |         await createVm();
17 | 
18 |         expect(document.body.innerHTML).toMatchSnapshot();
19 |     });
20 | });
21 | 
22 | async function createVm() {
23 |     const vm = new Vue({
24 |         el: '#app',
25 |     });
26 | 
27 |     await Vue.nextTick(() => {});
28 | 
29 |     return { app: vm, component: vm.$children[0] };
30 | }
31 | 


--------------------------------------------------------------------------------
/docs/index.html:
--------------------------------------------------------------------------------
 1 | <html>
 2 | <head>
 3 |     <title>package_name</title>
 4 | 
 5 |     <style>
 6 | 
 7 |         *,
 8 |         *:after,
 9 |         *:before {
10 |             box-sizing: border-box;
11 |             margin: 0;
12 |             padding: 0;
13 |         }
14 | 
15 |         body {
16 |             background-color: #efefef;
17 |             font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen-Sans, Ubuntu, Cantarell, 'Helvetica Neue', sans-serif;
18 |             font-size: 16px;
19 |             padding: 2em;
20 |         }
21 | 
22 |         .page {
23 |             background-color: #fff;
24 |             max-width: 66em;
25 |             margin: 0 auto;
26 |             padding: 4em 2em;
27 |         }
28 | 
29 |     </style>
30 | 
31 | </head>
32 | <body>
33 | <div id="app" class="page">
34 |     <div>
35 |         <ExampleComponent></ExampleComponent>
36 |     </div>
37 | </div>
38 | <script src="/build/app.js"></script>
39 | </body>
40 | </html>
41 | 


--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
 1 | The MIT License (MIT)
 2 | 
 3 | Copyright (c) Spatie bvba <info@spatie.be>
 4 | 
 5 | Permission is hereby granted, free of charge, to any person obtaining a copy
 6 | of this software and associated documentation files (the "Software"), to deal
 7 | in the Software without restriction, including without limitation the rights
 8 | to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
 9 | copies of the Software, and to permit persons to whom the Software is
10 | furnished to do so, subject to the following conditions:
11 | 
12 | The above copyright notice and this permission notice shall be included in
13 | all copies or substantial portions of the Software.
14 | 
15 | THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16 | IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17 | FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
18 | AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
19 | LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
20 | OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
21 | THE SOFTWARE.
22 | 


--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
 1 | {
 2 |   "name": "package_name",
 3 |   "version": "0.0.1",
 4 |   "description": "package_description",
 5 |   "main": "dist/index.js",
 6 |   "jsnext:main": "src/index.js",
 7 |   "scripts": {
 8 |     "start": "webpack-dev-server --config docs/webpack.config.js",
 9 |     "build": "rm -rf dist && NODE_ENV=production webpack",
10 |     "lint": "eslint --ext .js,.vue --fix src __tests__; exit 0",
11 |     "prepublish": "npm run test; npm run build",
12 |     "test": "jest"
13 |   },
14 |   "repository": {
15 |     "type": "git",
16 |     "url": "https://github.com/spatie/package_name.git"
17 |   },
18 |   "keywords": [
19 |     "spatie"
20 |   ],
21 |   "author": "author_name",
22 |   "license": "MIT",
23 |   "bugs": {
24 |     "url": "https://github.com/spatie/package_name/issues"
25 |   },
26 |   "homepage": "https://github.com/spatie/package_name",
27 |   "peerDependencies": {
28 |     "vue": "^2.3.0"
29 |   },
30 |   "devDependencies": {
31 |     "babel-core": "^6.24.1",
32 |     "babel-loader": "^7.0.0",
33 |     "babel-plugin-transform-object-rest-spread": "^6.16.0",
34 |     "babel-plugin-transform-runtime": "^6.23.0",
35 |     "babel-preset-env": "^1.4.0",
36 |     "css-loader": "^0.28.1",
37 |     "eslint": "^3.7.1",
38 |     "eslint-config-spatie": "^1.1.0",
39 |     "jest": "^19.0.0",
40 |     "jest-vue-preprocessor": "^0.2.0",
41 |     "vue": "^2.3.0",
42 |     "vue-loader": "^12.0.3",
43 |     "vue-template-compiler": "^2.3.0",
44 |     "webpack": "^2.3.3",
45 |     "webpack-dev-server": "^2.4.2",
46 |     "webpack-merge": "^4.1.0"
47 |   },
48 |   "jest": {
49 |     "testRegex": "test.js$",
50 |     "moduleFileExtensions": [
51 |       "js",
52 |       "vue"
53 |     ],
54 |     "transform": {
55 |       "^.+\\.js$": "<rootDir>/node_modules/babel-jest",
56 |       ".*\\.(vue)$": "<rootDir>/node_modules/jest-vue-preprocessor"
57 |     }
58 |   }
59 | }
60 | 


--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
 1 | 
 2 | [<img src="https://github-ads.s3.eu-central-1.amazonaws.com/support-ukraine.svg?t=1" />](https://supportukrainenow.org)
 3 | 
 4 | # package_description
 5 | 
 6 | [![Latest Version on NPM](https://img.shields.io/npm/v/package_name.svg?style=flat-square)](https://npmjs.com/package/package_name)
 7 | [![Software License](https://img.shields.io/badge/license-MIT-brightgreen.svg?style=flat-square)](LICENSE.md)
 8 | [![Build Status](https://img.shields.io/travis/spatie/package_name/master.svg?style=flat-square)](https://travis-ci.org/spatie/package_name)
 9 | 
10 | **Note:** Replace all occurrences ```author_name``` ```author_username``` ```author_email``` ```package_name``` ```package_description``` with their correct values, then delete this line.
11 | 
12 | Add a short description here, with some examples on how the package can be used.
13 | 
14 | ## Support us
15 | 
16 | [<img src="https://github-ads.s3.eu-central-1.amazonaws.com/skeleton-vue.jpg?t=1" width="419px" />](https://spatie.be/github-ad-click/skeleton-vue)
17 | 
18 | We invest a lot of resources into creating [best in class open source packages](https://spatie.be/open-source). You can support us by [buying one of our paid products](https://spatie.be/open-source/support-us).
19 | 
20 | We highly appreciate you sending us a postcard from your hometown, mentioning which of our package(s) you are using. You'll find our address on [our contact page](https://spatie.be/about-us). We publish all received postcards on [our virtual postcard wall](https://spatie.be/open-source/postcards).
21 | 
22 | ## Demo
23 | 
24 | Add a link to a site where the component is being demonstrated live.
25 | 
26 | ## Installation
27 | 
28 | You can install the package via yarn:
29 | 
30 | ```bash
31 | yarn add package_name
32 | ```
33 | 
34 | or npm:
35 | 
36 | ```bash
37 | npm install package_name --save
38 | ```
39 | 
40 | ## Usage
41 | 
42 | Add instruction on how the package can be used
43 | 
44 | ### Testing
45 | 
46 | ```bash
47 | yarn test
48 | ```
49 | 
50 | ### Changelog
51 | 
52 | Please see [CHANGELOG](CHANGELOG.md) for more information what has changed recently.
53 | 
54 | ## Contributing
55 | 
56 | Please see [CONTRIBUTING](https://github.com/spatie/.github/blob/main/CONTRIBUTING.md) for details.
57 | 
58 | ### Security
59 | 
60 | If you discover any security related issues, please contact :author_name instead of using the issue tracker.
61 | 
62 | ## License
63 | 
64 | The MIT License (MIT). Please see [License File](LICENSE.md) for more information.
65 | 
66 | #
67 | ## Credits
68 | 
69 | - [:author_name](https://github.com/:author_username)
70 | - [All Contributors](../../contributors)
71 | 
72 | ### About Spatie
73 | 
74 | Spatie is a webdesign agency based in Antwerp, Belgium. You'll find an overview of all our open source projects [on our website](https://spatie.be/opensource).
75 | 


--------------------------------------------------------------------------------