mirror of
https://github.com/jlengrand/undercover.git
synced 2026-03-10 08:51:23 +00:00
chore: create project
This commit is contained in:
3
.eslintignore
Normal file
3
.eslintignore
Normal file
@@ -0,0 +1,3 @@
|
||||
coverage/
|
||||
_site/
|
||||
dist/
|
||||
3
.eslintrc.js
Normal file
3
.eslintrc.js
Normal file
@@ -0,0 +1,3 @@
|
||||
module.exports = {
|
||||
extends: ['@open-wc/eslint-config', 'eslint-config-prettier', 'plugin:lit/recommended']
|
||||
};
|
||||
1
.gitignore
vendored
Normal file
1
.gitignore
vendored
Normal file
@@ -0,0 +1 @@
|
||||
node_modules
|
||||
20
.npmignore
Normal file
20
.npmignore
Normal 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
3
.prettierignore
Normal file
@@ -0,0 +1,3 @@
|
||||
coverage/
|
||||
_site/
|
||||
dist/
|
||||
27
README.md
Normal file
27
README.md
Normal file
@@ -0,0 +1,27 @@
|
||||
<p align="center">
|
||||
<img width="200" src="https://open-wc.org/hero.png"></img>
|
||||
</p>
|
||||
|
||||
## Open-wc Starter App
|
||||
|
||||
[](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
3
commitlint.config.js
Normal file
@@ -0,0 +1,3 @@
|
||||
module.exports = {
|
||||
extends: ['@commitlint/config-conventional'],
|
||||
};
|
||||
6
husky.config.js
Normal file
6
husky.config.js
Normal file
@@ -0,0 +1,6 @@
|
||||
module.exports = {
|
||||
hooks: {
|
||||
'pre-commit': 'lint-staged',
|
||||
'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS',
|
||||
},
|
||||
};
|
||||
27
index.html
Normal file
27
index.html
Normal 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
16
karma.bs.config.js
Normal 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
21
karma.conf.js
Normal 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
BIN
open-wc-starter-app.png
Normal file
Binary file not shown.
52
package.json
Normal file
52
package.json
Normal 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
1
prettier.config.js
Normal file
@@ -0,0 +1 @@
|
||||
module.exports = require('@open-wc/prettier-config');
|
||||
3
rollup.config.js
Normal file
3
rollup.config.js
Normal 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
27
src/open-wc-logo.js
Normal 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
82
src/under-cover.js
Normal 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
22
test/index.html
Normal 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
17
test/under-cover.test.js
Normal 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');
|
||||
});
|
||||
});
|
||||
Reference in New Issue
Block a user