1 | # Component rollup config
|
2 |
|
3 | > Extensible rollup configuration to build OVH components.
|
4 |
|
5 | [![Downloads](https://badgen.net/npm/dt/@ovh-ux/component-rollup-config)](https://npmjs.com/package/@ovh-ux/component-rollup-config) [![Dependencies](https://badgen.net/david/dep/ovh-ux/component-rollup-config)](https://npmjs.com/package/@ovh-ux/component-rollup-config?activeTab=dependencies) [![Dev Dependencies](https://badgen.net/david/dev/ovh-ux/component-rollup-config)](https://npmjs.com/package/@ovh-ux/component-rollup-config?activeTab=dependencies) [![Gitter](https://badgen.net/badge/gitter/ovh-ux/blue?icon=gitter)](https://gitter.im/ovh/ux)
|
6 |
|
7 | ## Install
|
8 |
|
9 | ```sh
|
10 | yarn add -D @ovh-ux/component-rollup-config
|
11 | ```
|
12 |
|
13 | ## Usage
|
14 |
|
15 | ```js
|
16 | import config from '@ovh-ux/component-rollup-config';
|
17 |
|
18 | export default config({
|
19 | input: 'src/index.js'
|
20 | })
|
21 | ```
|
22 |
|
23 | ## Plugins
|
24 |
|
25 | This configuration provides some plugins to facilitate loading and importing of ovh translations.
|
26 |
|
27 | ### translation-xml
|
28 |
|
29 | Convert translation XML files to JavaScript.
|
30 |
|
31 | ```xml
|
32 | <translations>
|
33 | <translation id="foo" qtlid="1">Foo</translation>
|
34 | <translation id="bar" qtlid="2">Bar</translation>
|
35 | </translations>
|
36 | ```
|
37 |
|
38 | ```js
|
39 | export default { foo: 'Foo', bar: 'Bar' };
|
40 | ```
|
41 |
|
42 | ### translation-ui-router
|
43 |
|
44 | Handle `translations` property in ui-router state declaration to dynamically load ovh translations when state is resolved.
|
45 |
|
46 | ```js
|
47 | // will import `./translations` and `../common/translations` during ui-router state resolve
|
48 | $stateProvider.state('my-state', {
|
49 | url: 'some-template.html',
|
50 | translations: ['.', '../common'],
|
51 | });
|
52 | ```
|
53 |
|
54 | ### translation-inject
|
55 |
|
56 | Handle `@ngTranslationsInject` comment in order to facilitate dynamic import of ovh translations.
|
57 |
|
58 | The format is as follows: `@ngTranslationsInject:{format} [translations]`
|
59 |
|
60 | `format` is a string which represent the format of translations files (xml, json, ...)
|
61 | `translations` is multiple strings separated by a space
|
62 |
|
63 | ```js
|
64 | angular
|
65 | .module('myModule', [])
|
66 | .run(/* @ngTranslationsInject ./translations ../common/translations */); // Load .translations and ../common/translations in xml
|
67 | .run(/* @ngTranslationsInject:xml ./translations ../common/translations */); // Load .translations and ../common/translations in xml
|
68 | .run(/* @ngTranslationsInject:json ./translations ../common/translations */); // Load .translations and ../common/translations in json
|
69 | ```
|
70 |
|
71 | ```js
|
72 | class MyController {
|
73 | constructor($injector) {
|
74 | 'ngInject';
|
75 |
|
76 | this.$injector = $injector;
|
77 | }
|
78 |
|
79 | $onInit() {
|
80 | this.isLoading = true;
|
81 | return this.$injector.invoke(
|
82 | /* @ngTranslationsInject ./translations ./some/other/path */
|
83 | ).finally(() => {
|
84 | this.isLoading = false;
|
85 | });
|
86 | }
|
87 | }
|
88 |
|
89 | angular
|
90 | .module('myModule', [])
|
91 | .controller('myController', MyController);
|
92 | ```
|
93 |
|
94 | ## Test
|
95 |
|
96 | ```sh
|
97 | yarn test
|
98 | ```
|
99 |
|
100 | ## Contributing
|
101 |
|
102 | Always feel free to help out! Whether it's [filing bugs and feature requests](https://github.com/ovh-ux/component-rollup-config/issues/new) or working on some of the [open issues](https://github.com/ovh-ux/component-rollup-config/issues), our [contributing guide](CONTRIBUTING.md) will help get you started.
|
103 |
|
104 | ## License
|
105 |
|
106 | [BSD-3-Clause](LICENSE) © OVH SAS
|