chore: create project

This commit is contained in:
Julien Lengrand-Lambert
2019-06-14 19:12:09 +02:00
commit e256cb4dcd
20 changed files with 8302 additions and 0 deletions

3
.eslintignore Normal file
View File

@@ -0,0 +1,3 @@
coverage/
_site/
dist/

3
.eslintrc.js Normal file
View File

@@ -0,0 +1,3 @@
module.exports = {
extends: ['@open-wc/eslint-config', 'eslint-config-prettier', 'plugin:lit/recommended']
};

1
.gitignore vendored Normal file
View File

@@ -0,0 +1 @@
node_modules

20
.npmignore Normal file
View File

@@ -0,0 +1,20 @@
## editors
/.idea
/.vscode
## system files
.DS_Store
# code coverage folders
coverage/
## npm
node_modules
npm-debug.log
## temp folders
/.tmp/
## build output
dist
build-stats.json

3
.prettierignore Normal file
View File

@@ -0,0 +1,3 @@
coverage/
_site/
dist/

27
README.md Normal file
View File

@@ -0,0 +1,27 @@
<p align="center">
<img width="200" src="https://open-wc.org/hero.png"></img>
</p>
## Open-wc Starter App
[![Built with open-wc recommendations](https://img.shields.io/badge/built%20with-open--wc-blue.svg)](https://github.com/open-wc)
## Quickstart
To get started:
```sh
npm init @open-wc starter-app
# requires node 10 & npm 6 or higher
```
<p align="center">
<img src="./open-wc-starter-app.png"></img>
</p>
## Scripts
- `build` builds your app and outputs it in your dist directory
- `start:build` runs your built app from dist directory
- `watch:build` builds and runs your app, rebuilding when input files change
- `test` runs your test suite with Karma
- `lint` runs the linter for your project

3
commitlint.config.js Normal file
View File

@@ -0,0 +1,3 @@
module.exports = {
extends: ['@commitlint/config-conventional'],
};

6
husky.config.js Normal file
View File

@@ -0,0 +1,6 @@
module.exports = {
hooks: {
'pre-commit': 'lint-staged',
'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS',
},
};

27
index.html Normal file
View File

@@ -0,0 +1,27 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, viewport-fit=cover" />
<meta name="Description" content="Put your description here.">
<style>
* {
margin: 0;
padding: 0;
font-family: sans-serif;
}
body {
background-color: #ededed;
}
</style>
<title>under-cover</title>
</head>
<body>
<under-cover></under-cover>
<script type="module" src="./src/under-cover.js"></script>
</body>
</html>

16
karma.bs.config.js Normal file
View File

@@ -0,0 +1,16 @@
/* eslint-disable import/no-extraneous-dependencies */
const merge = require('webpack-merge');
const bsSettings = require('@open-wc/testing-karma-bs/bs-settings.js');
const createBaseConfig = require('./karma.conf.js');
module.exports = config => {
config.set(
merge(bsSettings(config), createBaseConfig(config), {
browserStack: {
project: 'your-name',
},
}),
);
return config;
};

21
karma.conf.js Normal file
View File

@@ -0,0 +1,21 @@
/* eslint-disable import/no-extraneous-dependencies */
const createDefaultConfig = require('@open-wc/testing-karma/default-config');
const merge = require('webpack-merge');
module.exports = config => {
config.set(
merge(createDefaultConfig(config), {
files: [
// runs all files ending with .test in the test folder,
// can be overwritten by passing a --grep flag. examples:
//
// npm run test -- --grep test/foo/bar.test.js
// npm run test -- --grep test/bar/*
{ pattern: config.grep ? config.grep : 'test/**/*.test.js', type: 'module' }
],
// you can overwrite/extend the config further
}),
);
return config;
};

BIN
open-wc-starter-app.png Normal file

Binary file not shown.

52
package.json Normal file
View File

@@ -0,0 +1,52 @@
{
"scripts": {
"lint:eslint": "eslint --ext .js,.html .",
"format:eslint": "eslint --ext .js,.html . --fix",
"lint:prettier": "prettier \"**/*.js\" --list-different || (echo '↑↑ these files are not prettier formatted ↑↑' && exit 1)",
"format:prettier": "prettier \"**/*.js\" --write",
"lint": "npm run lint:eslint && npm run lint:prettier",
"format": "npm run format:eslint && npm run format:prettier",
"test": "karma start --coverage",
"test:watch": "karma start --auto-watch=true --single-run=false",
"test:update-snapshots": "karma start --update-snapshots",
"test:prune-snapshots": "karma start --prune-snapshots",
"test:legacy": "karma start --legacy --coverage",
"test:legacy:watch": "karma start --legacy --auto-watch=true --single-run=false",
"test:bs": "karma start karma.bs.config.js --legacy --coverage",
"build": "rimraf dist && rollup -c rollup.config.js",
"start:build": "http-server dist -o -c-1",
"watch:build": "rimraf dist && rollup --watch -c rollup.config.js & http-server dist -o -c-1",
"start": "owc-dev-server --open"
},
"devDependencies": {
"@open-wc/eslint-config": "^0.4.1",
"@open-wc/prettier-config": "^0.1.0",
"@commitlint/cli": "^7.0.0",
"@commitlint/config-conventional": "^7.0.0",
"husky": "^1.0.0",
"lint-staged": "^8.0.0",
"@open-wc/testing-karma": "^2.0.0",
"webpack-merge": "^4.1.5",
"@open-wc/testing-karma-bs": "^1.0.0",
"@open-wc/testing": "^0.11.1",
"@open-wc/building-rollup": "^0.3.0",
"http-server": "^0.11.1",
"rimraf": "^2.6.3",
"rollup": "^1.6.0",
"owc-dev-server": "^0.3.0",
"eslint-plugin-lit": "^1.0.0"
},
"lint-staged": {
"*.js": [
"eslint --fix",
"prettier --write",
"git add"
]
},
"name": "under-cover",
"license": "MIT",
"dependencies": {
"lit-html": "^1.0.0",
"lit-element": "^2.0.1"
}
}

1
prettier.config.js Normal file
View File

@@ -0,0 +1 @@
module.exports = require('@open-wc/prettier-config');

3
rollup.config.js Normal file
View File

@@ -0,0 +1,3 @@
import createDefaultConfig from '@open-wc/building-rollup/modern-config';
export default createDefaultConfig({ input: './index.html' });

27
src/open-wc-logo.js Normal file
View File

@@ -0,0 +1,27 @@
import { html } from 'lit-html';
export const openWc = html`
<svg
width="244px"
height="244px"
viewBox="0 0 244 244"
version="1.1"
xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink"
>
<defs>
<linearGradient x1="50%" y1="0%" x2="50%" y2="100%" id="linearGradient-1">
<stop stop-color="#9B00FF" offset="0%"></stop>
<stop stop-color="#0077FF" offset="100%"></stop>
</linearGradient>
</defs>
<g id="Page-1" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<path
d="M205.639259,176.936244 C207.430887,174.217233 209.093339,171.405629 210.617884,168.510161 M215.112174,158.724316 C216.385153,155.50304 217.495621,152.199852 218.433474,148.824851 M220.655293,138.874185 C221.231935,135.482212 221.637704,132.03207 221.863435,128.532919 M222,118.131039 C221.860539,114.466419 221.523806,110.85231 221.000113,107.299021 M218.885321,96.8583653 C218.001583,93.4468963 216.942225,90.1061026 215.717466,86.8461994 M211.549484,77.3039459 C209.957339,74.1238901 208.200597,71.0404957 206.290425,68.0649233 M200.180513,59.5598295 C181.848457,36.6639805 153.655709,22 122.036748,22 C66.7879774,22 22,66.771525 22,122 C22,177.228475 66.7879774,222 122.036748,222 C152.914668,222 180.52509,208.015313 198.875424,186.036326"
id="Shape"
stroke="url(#linearGradient-1)"
stroke-width="42.0804674"
></path>
</g>
</svg>
`;

82
src/under-cover.js Normal file
View File

@@ -0,0 +1,82 @@
import { LitElement, html, css } from 'lit-element';
import { openWc } from './open-wc-logo';
class UnderCover extends LitElement {
static get properties() {
return {
title: { type: String },
};
}
constructor() {
super();
this.title = 'open-wc';
}
static get styles() {
return [
css`
:host {
text-align: center;
min-height: 100vh;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
font-size: calc(10px + 2vmin);
color: #1a2b42;
}
header {
margin: auto;
}
svg {
animation: app-logo-spin infinite 20s linear;
}
a {
color: #217ff9;
}
.app-footer {
color: #a8a8a8;
font-size: calc(10px + 0.5vmin);
}
@keyframes app-logo-spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
`,
];
}
render() {
return html`
<header class="app-header">
${openWc}
<h1>${this.title}</h1>
<p>Edit <code>src/under-cover.js</code> and save to reload.</p>
<a
class="app-link"
href="https://open-wc.org/developing/#examples"
target="_blank"
rel="noopener noreferrer"
>
Code examples
</a>
</header>
<p class="app-footer">
🚽 Made with love by
<a target="_blank" rel="noopener noreferrer" href="https://github.com/open-wc">open-wc</a>.
</p>
`;
}
}
customElements.define('under-cover', UnderCover);

22
test/index.html Normal file
View File

@@ -0,0 +1,22 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link href="../node_modules/mocha/mocha.css" rel="stylesheet" />
<script src="../node_modules/mocha/mocha.js"></script>
<script src="../node_modules/@webcomponents/webcomponentsjs/webcomponents-bundle.js"></script>
</head>
<body>
<div id="mocha"></div>
<script>
mocha.setup('bdd');
</script>
<script type="module">
import './under-cover.test.js';
mocha.checkLeaks();
mocha.run();
</script>
</body>
</html>

17
test/under-cover.test.js Normal file
View File

@@ -0,0 +1,17 @@
import { html, fixture, expect } from '@open-wc/testing';
import '../src/under-cover';
describe('<under-cover>', () => {
it('has a default property header', async () => {
const el = await fixture('<under-cover></under-cover>');
expect(el.title).to.equal('open-wc');
});
it('allows property header to be overwritten', async () => {
const el = await fixture(html`
<under-cover title="different"></under-cover>
`);
expect(el.title).to.equal('different');
});
});

7968
yarn.lock Normal file

File diff suppressed because it is too large Load Diff