Skip to content

Commit 49ecb16

Browse files
wosevisionwosevision
committed
Initialize the project 🚀
0 parents  commit 49ecb16

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

50 files changed

+1379
-0
lines changed

‎.gitignore

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
.DS_Store
2+
.thumbs.db
3+
node_modules
4+
dist
5+
yarn.lock
6+
npm-debug.log*
7+
yarn-debug.log*
8+
yarn-error.log*
9+
10+
# Editor directories and files
11+
.idea
12+
.vscode
13+
*.suo
14+
*.ntvs*
15+
*.njsproj
16+
*.sln

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
The MIT License (MIT)
2+
3+
Copyright (c) Jackson Teather <jacksonteather@hotmail.com>
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.

‎README.md

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
<img src="https://img.shields.io/npm/v/quasar-ui-test-ui.svg?label=quasar-ui-test-ui">
2+
<img src="https://img.shields.io/npm/v/quasar-app-extension-test-ui.svg?label=quasar-app-extension-test-ui">
3+
4+
Compatible with Quasar UI v2 and Vue 3.
5+
6+
# Structure
7+
* [/ui](ui) - standalone npm package
8+
9+
* [/app-extension](app-extension) - Quasar app extension
10+
11+
12+
# Donate
13+
If you appreciate the work that went into this project, please consider [donating to Quasar](https://donate.quasar.dev).
14+
15+
# License
16+
MIT (c) Jackson Teather <jacksonteather@hotmail.com>

‎app-extension/.npmignore

+17
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,17 @@
1+
.DS_Store
2+
.thumbs.db
3+
yarn.lock
4+
npm-debug.log*
5+
yarn-debug.log*
6+
yarn-error.log*
7+
8+
# Editor directories and files
9+
.idea
10+
.vscode
11+
*.suo
12+
*.ntvs*
13+
*.njsproj
14+
*.sln
15+
.editorconfig
16+
.eslintignore
17+
.eslintrc.js

‎app-extension/README.md

+33
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,33 @@
1+
# Quasar App Extension test-ui
2+
3+
> Add a short description of your App Extension. What does it do? How is it beneficial? Why would someone want to use it?
4+
5+
[![npm](https://img.shields.io/npm/v/quasar-app-extension-test-ui.svg?label=quasar-app-extension-test-ui)](https://www.npmjs.com/package/quasar-app-extension-test-ui)
6+
[![npm](https://img.shields.io/npm/dt/quasar-app-extension-test-ui.svg)](https://www.npmjs.com/package/quasar-app-extension-test-ui)
7+
8+
# Install
9+
```bash
10+
quasar ext add test-ui
11+
```
12+
Quasar CLI will retrieve it from NPM and install the extension.
13+
14+
## Prompts
15+
16+
> If your app extension uses prompts, explain them here, otherwise remove this section and remove prompts.js file.
17+
18+
# Uninstall
19+
```bash
20+
quasar ext remove test-ui
21+
```
22+
23+
# Info
24+
> Add longer information here that will help the user of your app extension.
25+
26+
# Other Info
27+
> Add other information that's not as important to know
28+
29+
# Donate
30+
If you appreciate the work that went into this App Extension, please consider [donating to Quasar](https://donate.quasar.dev).
31+
32+
# License
33+
MIT (c) Jackson Teather <jacksonteather@hotmail.com>

‎app-extension/package.json

+16
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,16 @@
1+
{
2+
"name": "quasar-app-extension-test-ui",
3+
"version": "0.0.1",
4+
"description": "A Quasar App Extension",
5+
"author": "Jackson Teather <jacksonteather@hotmail.com>",
6+
"license": "MIT",
7+
"type": "module",
8+
"dependencies": {
9+
"quasar-ui-test-ui": "latest"
10+
},
11+
"engines": {
12+
"node": ">= 8.9.0",
13+
"npm": ">= 5.6.0",
14+
"yarn": ">= 1.6.0"
15+
}
16+
}

‎app-extension/src/boot/register.js

+6
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
import { boot } from 'quasar/wrappers'
2+
import VuePlugin from 'quasar-ui-test-ui'
3+
4+
export default boot(({ app }) => {
5+
app.use(VuePlugin)
6+
})

‎app-extension/src/index.js

+45
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,45 @@
1+
/**
2+
* Quasar App Extension index/runner script
3+
* (runs on each dev/build)
4+
*
5+
* Docs: https://quasar.dev/app-extensions/development-guide/index-api
6+
*/
7+
8+
function extendConf (conf, api) {
9+
// register our boot file
10+
conf.boot.push('~quasar-app-extension-test-ui/src/boot/register.js')
11+
12+
if (api.hasWebpack) {
13+
// make sure app extension files & ui package gets transpiled
14+
const transpileTarget = (
15+
conf.build.webpackTranspileDependencies // q/app-webpack >= v4
16+
|| conf.build.transpileDependencies // q/app-webpack v3
17+
)
18+
transpileTarget.push(/quasar-app-extension-test-ui[\\/]src/)
19+
}
20+
21+
// make sure the stylesheet goes through webpack to avoid SSR issues
22+
conf.css.push('~quasar-ui-test-ui/src/index.sass')
23+
}
24+
25+
export default function (api) {
26+
// Quasar compatibility check; you may need
27+
// hard dependencies, as in a minimum version of the "quasar"
28+
// package or a minimum version of "@quasar/app-*" CLI
29+
api.compatibleWith('quasar', '^2.0.0')
30+
31+
if (api.hasVite) {
32+
api.compatibleWith('@quasar/app-vite', '^1.5.0 || ^2.0.0')
33+
}
34+
else if (api.hasWebpack) {
35+
api.compatibleWith('@quasar/app-webpack', '^3.10.0 || ^4.0.0')
36+
}
37+
38+
39+
// Uncomment the line below if you provide a JSON API for your component
40+
// api.registerDescribeApi('MyComponent', '~quasar-ui-test-ui/src/components/MyComponent.json')
41+
42+
43+
// We extend /quasar.conf.js
44+
api.extendQuasarConf(extendConf)
45+
}

‎app-extension/src/templates/.gitkeep

Whitespace-only changes.

‎jsconfig.json

+10
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
{
2+
"compilerOptions": {
3+
"baseUrl": ".",
4+
"paths": {
5+
"ui/*": [
6+
"src/*"
7+
]
8+
}
9+
}
10+
}

‎ui/.npmignore

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
/build
2+
/dev
3+
umd-test.html
4+
5+
.DS_Store
6+
.thumbs.db
7+
yarn.lock
8+
npm-debug.log*
9+
yarn-debug.log*
10+
yarn-error.log*
11+
12+
# Editor directories and files
13+
.idea
14+
.vscode
15+
*.suo
16+
*.ntvs*
17+
*.njsproj
18+
*.sln
19+
.editorconfig
20+
.eslintignore
21+
.eslintrc.js

‎ui/README.md

+145
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,145 @@
1+
# Component MyComponent
2+
3+
[![npm](https://img.shields.io/npm/v/quasar-ui-test-ui.svg?label=quasar-ui-test-ui)](https://www.npmjs.com/package/quasar-ui-test-ui)
4+
[![npm](https://img.shields.io/npm/dt/quasar-ui-test-ui.svg)](https://www.npmjs.com/package/quasar-ui-test-ui)
5+
6+
**Compatible with Quasar UI v2 and Vue 3**.
7+
8+
9+
# Component MyComponent
10+
> Short description of the component
11+
12+
13+
14+
15+
# Usage
16+
17+
## Quasar CLI project
18+
19+
20+
Install the [App Extension](../app-extension).
21+
22+
**OR**:
23+
24+
25+
Create and register a boot file:
26+
27+
```js
28+
import Vue from 'vue'
29+
import Plugin from 'quasar-ui-test-ui'
30+
import 'quasar-ui-test-ui/dist/index.css'
31+
32+
Vue.use(Plugin)
33+
```
34+
35+
**OR**:
36+
37+
```html
38+
<style src="quasar-ui-test-ui/dist/index.css"></style>
39+
40+
<script>
41+
import { Component as MyComponent } from 'quasar-ui-test-ui'
42+
43+
export default {
44+
45+
components: {
46+
MyComponent
47+
}
48+
49+
50+
}
51+
</script>
52+
```
53+
54+
## Vue CLI project
55+
56+
```js
57+
import Vue from 'vue'
58+
import Plugin from 'quasar-ui-test-ui'
59+
import 'quasar-ui-test-ui/dist/index.css'
60+
61+
Vue.use(Plugin)
62+
```
63+
64+
**OR**:
65+
66+
```html
67+
<style src="quasar-ui-test-ui/dist/index.css"></style>
68+
69+
<script>
70+
import { Component as MyComponent } from 'quasar-ui-test-ui'
71+
72+
export default {
73+
74+
components: {
75+
MyComponent
76+
}
77+
78+
79+
}
80+
</script>
81+
```
82+
83+
## UMD variant
84+
85+
Exports `window.testUi`.
86+
87+
Add the following tag(s) after the Quasar ones:
88+
89+
```html
90+
<head>
91+
<!-- AFTER the Quasar stylesheet tags: -->
92+
<link href="https://cdn.jsdelivr.net/npm/quasar-ui-test-ui/dist/index.min.css" rel="stylesheet" type="text/css">
93+
</head>
94+
<body>
95+
<!-- at end of body, AFTER Quasar script(s): -->
96+
<script src="https://cdn.jsdelivr.net/npm/quasar-ui-test-ui/dist/index.umd.min.js"></script>
97+
</body>
98+
```
99+
If you need the RTL variant of the CSS, then go for the following (instead of the above stylesheet link):
100+
```html
101+
<link href="https://cdn.jsdelivr.net/npm/quasar-ui-test-ui/dist/index.rtl.min.css" rel="stylesheet" type="text/css">
102+
```
103+
104+
# Setup
105+
```bash
106+
$ yarn
107+
```
108+
109+
# Developing
110+
```bash
111+
# start dev in SPA mode
112+
$ yarn dev
113+
114+
# start dev in UMD mode
115+
$ yarn dev:umd
116+
117+
# start dev in SSR mode
118+
$ yarn dev:ssr
119+
120+
# start dev in Cordova iOS mode
121+
$ yarn dev:ios
122+
123+
# start dev in Cordova Android mode
124+
$ yarn dev:android
125+
126+
# start dev in Electron mode
127+
$ yarn dev:electron
128+
```
129+
130+
# Building package
131+
```bash
132+
$ yarn build
133+
```
134+
135+
# Adding Testing Components
136+
in the `ui/dev/src/pages` you can add Vue files to test your component/directive. When using `yarn dev` to build the UI, any pages in that location will automatically be picked up by dynamic routing and added to the test page.
137+
138+
# Adding Assets
139+
If you have a component that has assets, like language or icon-sets, you will need to provide these for UMD. In the `ui/build/script.javascript.js` file, you will find a couple of commented out commands that call `addAssets`. Uncomment what you need and add your assets to have them be built and put into the `ui/dist` folder.
140+
141+
# Donate
142+
If you appreciate the work that went into this, please consider [donating to Quasar](https://donate.quasar.dev).
143+
144+
# License
145+
MIT (c) Jackson Teather <jacksonteather@hotmail.com>

‎ui/build/config.js

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
const { name, author, version } = require('../package.json')
2+
const year = (new Date()).getFullYear()
3+
4+
module.exports = {
5+
name,
6+
version,
7+
banner:
8+
'/*!\n' +
9+
' * ' + name + ' v' + version + '\n' +
10+
' * (c) ' + year + ' ' + author + '\n' +
11+
' * Released under the MIT License.\n' +
12+
' */\n'
13+
}

‎ui/build/index.js

+19
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,19 @@
1+
process.env.NODE_ENV = 'production'
2+
3+
const parallel = require('os').cpus().length > 1
4+
const runJob = parallel ? require('child_process').fork : require
5+
const { join } = require('path')
6+
const { createFolder } = require('./utils')
7+
const { green, blue } = require('chalk')
8+
9+
console.log()
10+
11+
require('./script.app-ext.js').syncAppExt()
12+
require('./script.clean.js')
13+
14+
console.log(` 📦 Building ${green('v' + require('../package.json').version)}...${parallel ? blue(' [multi-threaded]') : ''}\n`)
15+
16+
createFolder('dist')
17+
18+
runJob(join(__dirname, './script.javascript.js'))
19+
runJob(join(__dirname, './script.css.js'))

0 commit comments

Comments
 (0)