@mirweb/mir-web-components 2.3.9 → 2.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
#
|
|
1
|
+
# MiRs Vue Component library
|
|
2
2
|
|
|
3
3
|
This is Mobile Industrial Robots component library for MiR Main, Support Portal and Academy built in Vue 3 + TypeScript + Vite.
|
|
4
4
|
|
|
@@ -7,42 +7,98 @@ This is Mobile Industrial Robots component library for MiR Main, Support Portal
|
|
|
7
7
|
Make sure to install the dependencies:
|
|
8
8
|
|
|
9
9
|
```bash
|
|
10
|
-
|
|
11
|
-
yarn install
|
|
10
|
+
pnpm install
|
|
12
11
|
```
|
|
13
12
|
|
|
14
|
-
##
|
|
13
|
+
## Development Server
|
|
14
|
+
|
|
15
|
+
Start the development server
|
|
16
|
+
|
|
17
|
+
```bash
|
|
18
|
+
pnpm dev
|
|
19
|
+
```
|
|
20
|
+
|
|
21
|
+
## Production
|
|
22
|
+
|
|
23
|
+
Build the library for production:
|
|
15
24
|
|
|
16
|
-
|
|
25
|
+
```bash
|
|
26
|
+
pnpm build
|
|
27
|
+
```
|
|
17
28
|
|
|
18
|
-
|
|
29
|
+
## How to create a new component
|
|
30
|
+
|
|
31
|
+
Create a new folder and file under _/components_
|
|
32
|
+
|
|
33
|
+
Import the component in **App.vue** for development, e.g.:
|
|
19
34
|
|
|
20
35
|
```bash
|
|
21
36
|
import frontpageHero from "@/components/blocks/frontpage-hero/frontpage-hero.vue";
|
|
22
37
|
```
|
|
23
38
|
|
|
24
|
-
Import the global styles in App.vue
|
|
39
|
+
Import the global styles in **App.vue**
|
|
25
40
|
|
|
26
41
|
```bash
|
|
27
42
|
@import "@/assets/main.scss";
|
|
28
43
|
```
|
|
29
44
|
|
|
30
|
-
When the component is
|
|
45
|
+
When the component is developed, remember to export it in both **index.ts** and **main.ts** under _/components_ - and clean up **App.vue** before committing.
|
|
31
46
|
|
|
32
|
-
And please clean up the App.vue in the commit
|
|
33
47
|
|
|
34
|
-
## Development Server
|
|
35
48
|
|
|
36
|
-
|
|
49
|
+
## NPM Release workflow
|
|
50
|
+
|
|
51
|
+
When changes are pushed to the main branch, a new version of the npm package will automatically be released via GitHub Actions. This is possible by using semantic-release, which analyzes the newly added commits and updates the npm package version number accordingly. For this to work as intended, commit messages must follow the Angular Commit Message convention.
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
See table below for examples -
|
|
55
|
+
|
|
56
|
+
| **Commit Message Pattern** | **Release Type** | **Example Commit Message** | **Example Version Change** | **Notes** |
|
|
57
|
+
|-----------------------------|------------------|-----------------------------|-----------------------------|------------|
|
|
58
|
+
| `fix(scope): summary` | **Patch (Fix release)** | `fix(button): fix styling on button` | `v0.1.0 → v0.1.1` | Used for bug fixes and small patches. |
|
|
59
|
+
| `feat(scope): summary` | **Minor (Feature release)** | `feat(button): add button component` | `v0.1.0 → v0.2.0` | Used when adding new features that don’t break existing functionality. |
|
|
60
|
+
| `perf(scope): summary` +<br>`BREAKING CHANGE: description` | **Major (Breaking release)** | `perf(button): remove button component`<br>`BREAKING CHANGE: The button component has been removed for performance reasons.` | `v0.1.0 → v1.0.0` | “BREAKING CHANGE:” must appear in the footer of the commit message. Indicates incompatible API changes. |
|
|
61
|
+
|
|
62
|
+
|
|
63
|
+
_*Defining the scope is optional. Commit messages can also be written as, e.g. “feat: add new feature”_
|
|
64
|
+
|
|
65
|
+
_**If the scope is set to “no-release”, then the commit won’t trigger a release_
|
|
66
|
+
|
|
67
|
+
_***Additional commit types can be configured with the commit-analyzer plugin_
|
|
68
|
+
|
|
69
|
+
### Local testing environment using the latest changes to componentlibrary
|
|
70
|
+
|
|
71
|
+
To test your latest changes to the componentlibrary without having to merge and deploy trough Git you should first delete the dist folder in your component library and then run the following command:
|
|
37
72
|
|
|
38
73
|
```bash
|
|
39
|
-
pnpm
|
|
74
|
+
pnpm build
|
|
40
75
|
```
|
|
41
76
|
|
|
42
|
-
|
|
77
|
+
Now you should change the following line in your package.json on the portal you are working on eg. mirwebfrontend:
|
|
43
78
|
|
|
44
|
-
|
|
79
|
+
```bash
|
|
80
|
+
"dependencies": {
|
|
81
|
+
"@mirweb/mir-web-components": "file:<PATH TO COMPONENTLIBRARY>",
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
For instance: "@mirweb/mir-web-components": "file:C:/github/componentlibrary",
|
|
85
|
+
|
|
86
|
+
Now run the following commands
|
|
45
87
|
|
|
46
88
|
```bash
|
|
89
|
+
pnpm i
|
|
47
90
|
pnpm build
|
|
91
|
+
node .output/server/index.mjs
|
|
48
92
|
```
|
|
93
|
+
|
|
94
|
+
#### Tools to enforce valid commit messages
|
|
95
|
+
|
|
96
|
+
Check out the following tools:
|
|
97
|
+
|
|
98
|
+
https://github.com/commitizen/cz-cli
|
|
99
|
+
|
|
100
|
+
https://github.com/conventional-changelog/commitlint
|
|
101
|
+
|
|
102
|
+
|
|
103
|
+
|
|
104
|
+
|
|
@@ -9,7 +9,7 @@
|
|
|
9
9
|
<div v-if="info" class="event__info">{{ info }}</div>
|
|
10
10
|
<div v-if="location">{{ location }}</div>
|
|
11
11
|
</div>
|
|
12
|
-
<div class="event__exhibitor">{{ exhibitor }}</div>
|
|
12
|
+
<div v-if="exhibitor" class="event__exhibitor">{{ exhibitor }}</div>
|
|
13
13
|
</div>
|
|
14
14
|
</template>
|
|
15
15
|
|
|
@@ -35,7 +35,7 @@ defineProps({
|
|
|
35
35
|
},
|
|
36
36
|
exhibitor: {
|
|
37
37
|
type: String,
|
|
38
|
-
required:
|
|
38
|
+
required: false,
|
|
39
39
|
},
|
|
40
40
|
info: {
|
|
41
41
|
type: String,
|