shopify-preconnect 1.0.14 β 1.0.15
Sign up to get free protection for your applications and to get access to all the features.
- package/.idea/inspectionProfiles/Project_Default.xml +6 -0
- package/.idea/modules.xml +8 -0
- package/.idea/shopify-connect.iml +12 -0
- package/.idea/vcs.xml +6 -0
- package/.pnp.cjs +30584 -0
- package/.pnp.loader.mjs +2042 -0
- package/LICENSE +21 -0
- package/README.md +138 -0
- package/dist/preconnect.min.js +1 -0
- package/dist/with-delay.min.js +1 -0
- package/package.json +72 -6
- package/index.min.js +0 -1
package/LICENSE
ADDED
@@ -0,0 +1,21 @@
|
|
1
|
+
MIT License
|
2
|
+
|
3
|
+
Copyright (c) Quique Fdez Guerra
|
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 all
|
13
|
+
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 THE
|
21
|
+
SOFTWARE.
|
package/README.md
ADDED
@@ -0,0 +1,138 @@
|
|
1
|
+
<a id="logos" class="anchor" aria-hidden="true" href="#logos"></a><br/>
|
2
|
+
|
3
|
+
<h1 align="center">
|
4
|
+
<p align="center">Frontend Boilerplates</p>
|
5
|
+
<a href="https://boilerplates.js.org"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/logo/logo.png" width="150" alt="Boilerplates"></a>
|
6
|
+
</h1>
|
7
|
+
|
8
|
+
### π Overview
|
9
|
+
|
10
|
+
This repository is a group of **boilerplates** including some **good practises** and **tips** that you can follow in your projects. There are different technologies separated by branches but with similar structures to write **scalable** applications. Some of them include [JavaScript](https://github.com/CKGrafico/Frontend-Boilerplates/tree/basic#logos), [TypeScript](https://github.com/CKGrafico/Frontend-Boilerplates/tree/ts#logos), [Vue](https://github.com/CKGrafico/Frontend-Boilerplates/tree/vue#logos) or [React](https://github.com/CKGrafico/Frontend-Boilerplates/tree/react#logos). **Click on the logos** to navigate through them.
|
11
|
+
|
12
|
+
<h1 align="center">
|
13
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/basic#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/spa-d.png" alt="JavaScript Boilerplate" width="150"></a>
|
14
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/vue#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/vue-d.png" alt="Vue Boilerplate" width="150"></a>
|
15
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/react#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/react-d.png" alt="React Boilerplate" width="150"></a>
|
16
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/ts#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/ts.png" alt="TypeScript Boilerplate" width="150"></a>
|
17
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/phaser#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/phaser-d.png" alt="Phaser Boilerplate" width="150"></a>
|
18
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/cypress#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/cypress-d.png" alt="Cypress Boilerplate" width="150"></a>
|
19
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/nuxt#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/nuxt-d.png" alt="Nuxt Boilerplate" width="150"></a>
|
20
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/tree/node-ts#logos"><img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/nodets-d.png" alt="Node and TS Boilerplate" width="150"></a>
|
21
|
+
|
22
|
+
</h1>
|
23
|
+
|
24
|
+
<p align="center">
|
25
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/blob/basic/LICENSE"><img src="https://img.shields.io/github/license/CKGrafico/Frontend-Boilerplates.svg?logo=creative%20commons&color=8FBFA9&logoColor=FFFFFF" alt="GitHub license" /></a>
|
26
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/network"><img src="https://img.shields.io/github/stars/CKGrafico/Frontend-Boilerplates.svg?logo=verizon&color=4D8C6F" alt="GitHub stars" /></a>
|
27
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/network"><img src="https://img.shields.io/github/forks/CKGrafico/Frontend-Boilerplates.svg?logo=github&color=38A3A5" alt="GitHub forks" /></a>
|
28
|
+
<a href="https://codesandbox.io/s/github/CKGrafico/Frontend-Boilerplates/tree/ts"><img src="https://img.shields.io/badge/CodeSandbox-template?logo=codesandbox&color=0971f1" alt="Open in CodeSandbox" /></a>
|
29
|
+
<a href="https://twitter.com/CKGrafico"><img src="https://img.shields.io/badge/Tweet-project?logo=twitter&color=00acee&logoColor=FFFFFF" alt="Sponsor" /></a>
|
30
|
+
<a href="https://github.com/sponsors/CKGrafico"><img src="https://img.shields.io/badge/Support-project?logo=ko-fi&color=ea4aaa&logoColor=FFFFFF" alt="Sponsor" /></a>
|
31
|
+
<a href="https://travis-ci.org/CKGrafico/Frontend-Boilerplates"><img src="https://travis-ci.org/CKGrafico/Frontend-Boilerplates.svg?logo=travis&branch=ts" alt="Build Status" /></a>
|
32
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/issues"><img src="https://img.shields.io/github/issues/CKGrafico/Frontend-Boilerplates.svg?logo=codeigniter&logoColor=FFFFFF" alt="GitHub issues" /></a>
|
33
|
+
<a href="https://github.com/CKGrafico/Frontend-Boilerplates/releases"><img src="https://img.shields.io/badge/Update%20status-Frequently-009C7C?logo=git&logoColor=FFFFFF" alt="Update Status" /></a>
|
34
|
+
|
35
|
+
</p>
|
36
|
+
|
37
|
+
### <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/ts.png" align="left" width="35" title="Boilerplate" /> TypeScript - Boilerplate Features
|
38
|
+
|
39
|
+
These are the most relevant technologies that this boilerplate includes, all of them are configured to inspire your project and are showing examples of what you can do with them.
|
40
|
+
|
41
|
+
- **TypeScript:** Written in TypeScript language.
|
42
|
+
- **PostCSS:** Be ready for the next CSS features.
|
43
|
+
- **Bootstrap:** Build fast and responsive sites easily.
|
44
|
+
- **Autoprefixer:** Automatically add vendor prefixes to these Styles.
|
45
|
+
- **Webpack:** Automation of tasks and compilation of the project.
|
46
|
+
- **Babel:** Transpiler to different versions of EcmaScript.
|
47
|
+
- **Browserlist:** To configure which browsers will support.
|
48
|
+
- **Jest:** Framework for testing.
|
49
|
+
- **ESLint:** Linting for Scripts.
|
50
|
+
- **StyleLint:** Linting for Styles.
|
51
|
+
- **Prettier:** Formatter for Scripts and Styles.
|
52
|
+
- **EditorConfig:** Formatter for files in general.
|
53
|
+
- **Husky:** Used for attaching to git hooks and run scripts.
|
54
|
+
|
55
|
+
### π₯ Demo (In progress)
|
56
|
+
|
57
|
+
Once you download the project you will find a complete demo of how it works, including (each boilerplate could include different examples):
|
58
|
+
|
59
|
+
- **Page:** Example of how to create a page.
|
60
|
+
- **File structure:** Project structure [following "feature" convention](https://medium.com/@CKGrafico/taking-decisions-to-structure-big-projects-with-hooks-stores-services-and-more-a703c7874480).
|
61
|
+
- **Styles structure:** Structure, mixins and variables using [non-strict BEM](https://medium.com/@CKGrafico/choosing-how-to-structure-our-css-components-7af3c7ea4f27).
|
62
|
+
- **File names:** File names structure [using "type name" convention](https://medium.com/@CKGrafico/taking-decisions-to-structure-big-projects-with-hooks-stores-services-and-more-a703c7874480).
|
63
|
+
|
64
|
+
### π Setup and scripts
|
65
|
+
|
66
|
+
> Before start [download](https://github.com/CKGrafico/Frontend-Boilerplates/archive/ts.zip) or clone the boilerplate.
|
67
|
+
> **Install** all the dependencies.
|
68
|
+
|
69
|
+
```shell
|
70
|
+
$ npm install
|
71
|
+
```
|
72
|
+
|
73
|
+
**Run** the project for local development.
|
74
|
+
|
75
|
+
```shell
|
76
|
+
$ npm start
|
77
|
+
```
|
78
|
+
|
79
|
+
**Build** the project for a production environment.
|
80
|
+
|
81
|
+
```shell
|
82
|
+
$ npm run build
|
83
|
+
```
|
84
|
+
|
85
|
+
**Test** your code.
|
86
|
+
|
87
|
+
```shell
|
88
|
+
$ npm test
|
89
|
+
```
|
90
|
+
|
91
|
+
The **linting** is configured with [**husky**](https://github.com/typicode/husky) and will run before commit, but you can run it.
|
92
|
+
|
93
|
+
```shell
|
94
|
+
$ npm run lint # (Will run scripts and styles linting with autofix)
|
95
|
+
$ npm run lint:scripts # (Will run ESLint)
|
96
|
+
$ npm run lint:styles # (Will run Stylelint)
|
97
|
+
$ npm run lint:editor # (Will run ECLint)
|
98
|
+
```
|
99
|
+
|
100
|
+
### π© Contributors
|
101
|
+
|
102
|
+
This project is possible thanks to the contributors.
|
103
|
+
|
104
|
+
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
|
105
|
+
<!-- prettier-ignore-start -->
|
106
|
+
<!-- markdownlint-disable -->
|
107
|
+
<table>
|
108
|
+
<tr>
|
109
|
+
<td align="center"><a href="http://CKgrafico.com"><img src="https://avatars1.githubusercontent.com/u/2048511?v=4" width="150px;" alt=""/><br /><sub><b>Quique Fdez Guerra</b></sub></a><br /><a href="#platform-ckgrafico" title="Packaging/porting to new platform">π¦</a> <a href="https://github.com/CKGrafico/Frontend-Boilerplates/commits?author=ckgrafico" title="Code">π»</a> <a href="#tool-ckgrafico" title="Tools">π§</a></td>
|
110
|
+
<td align="center"><a href="https://github.com/spertusatti"><img src="https://avatars0.githubusercontent.com/u/25738279?v=4" width="150px;" alt=""/><br /><sub><b>Sabrina Pertusatti</b></sub></a><br /><a href="https://github.com/CKGrafico/Frontend-Boilerplates/commits?author=spertusatti" title="Code">π»</a></td>
|
111
|
+
<td align="center"><a href="https://www.linkedin.com/in/victor-gamez/"><img src="https://avatars0.githubusercontent.com/u/14943217?v=4" width="150px;" alt=""/><br /><sub><b>VΓctor GΓ‘mez</b></sub></a><br /><a href="https://github.com/CKGrafico/Frontend-Boilerplates/commits?author=VGamezz19" title="Code">π»</a></td>
|
112
|
+
<td align="center"><a href="http://kryzh.com"><img src="https://avatars1.githubusercontent.com/u/2675648?v=4" width="150px;" alt=""/><br /><sub><b>Alex Kryzhanovskyy</b></sub></a><br /><a href="https://github.com/CKGrafico/Frontend-Boilerplates/commits?author=AlexKryzh" title="Code">π»</a></td>
|
113
|
+
<td align="center"><a href="https://github.com/jcarloslr10"><img src="https://avatars0.githubusercontent.com/u/15978818?v=4" width="150px;" alt=""/><br /><sub><b>Juan Carlos</b></sub></a><br /><a href="https://github.com/CKGrafico/Frontend-Boilerplates/commits?author=jcarloslr10" title="Code">π»</a></td>
|
114
|
+
</tr>
|
115
|
+
</table>
|
116
|
+
|
117
|
+
<!-- markdownlint-enable -->
|
118
|
+
<!-- prettier-ignore-end -->
|
119
|
+
|
120
|
+
<!-- ALL-CONTRIBUTORS-LIST:END -->
|
121
|
+
|
122
|
+
### β³οΈ Check all the boilerplates
|
123
|
+
|
124
|
+
- **[basic:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/basic#logos)** **Basic SPA** example using JavaScript. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/spa.png" align="right" width="35" title="SPA">
|
125
|
+
|
126
|
+
- **[vue:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/vue#logos)** **Vuejs** example using TypeScript. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/vue.png" align="right" width="35" title="Vue">
|
127
|
+
|
128
|
+
- **[react:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/react#logos)** **React** example using React and TypeScript. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/react.png" align="right" width="35" title="React">
|
129
|
+
|
130
|
+
- **[phaser:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/phaser#logos)** **Phaser** example using TypeScript and React. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/phaser.png" align="right" width="35" title="Phaser">
|
131
|
+
|
132
|
+
- **[ts:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/ts#logos)** **TypeScript** example using TypeScript. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/ts.png" align="right" width="35" title="TypeScript">
|
133
|
+
|
134
|
+
- **[cypress:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/cypress#logos)** **Cypress** example using Cypress and TypeScript. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/cypress.png" align="right" width="35" title="Cypress">
|
135
|
+
|
136
|
+
- **[nuxt:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/nuxt#logos)** **Nuxt** example using Nuxt and TypeScript. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/nuxt.png" align="right" width="35" title="Nuxt">
|
137
|
+
|
138
|
+
- **[node-ts:](https://github.com/CKGrafico/Frontend-Boilerplates/tree/node-ts#logos)** **Backend and TypeScript** example with SCSS and Nodejs. <img src="https://raw.githubusercontent.com/CKGrafico/Frontend-Boilerplates/docs/resources/techs/nodets.png" align="right" width="35" title="Node with TypeScript">
|