FAQ

Why aren't actions included by default?

The decision to not include actions in the core package by default is to remain faithful to the philosophy of keeping Harlem lightweight, simple and unopinionated. Different projects have different needs for actions. Some larger projects may require nested actions and cancellation while smaller projects may not need all of those features but instead just need simple direct mutations.

To ship a full action implementation as part of the core package would force every project (especially the small projects) to incur that cost (size, performance etc.) even if not all of the action features are being used. For this reason Harlem provides a full-featured action implementation as an optional extension and leaves your action implementation up to you should you wish to keep things simple or get really complex.

Can I share state between stores?

Certainly - just import the state or getter from one store into the getter you are authoring on another store. For example:

import {
    state as otherState
} from '../other-store;

import {
    getter
} from './store';

export const myNumberGetter = getter('myNumber', state => state.myNumber +  otherState.otherNumber);
1
2
3
4
5
6
7
8
9

This also works for importing getters from other stores. Just remember that to access the value of a getter you will need to use the .value property of the getter. For example, if I had a getter name myGetter and I wanted to use it in another getter I would have to use myGetter.value to access it's raw value.

See the Vue documentation on computeds for more information. Vue Computedopen in new window.

Does Harlem have a file structure convention for stores?

Short answer, no. Because Harlem attempts to be as unonpinionated as possible that means it's up to you to structure your store how you see fit. That being said here are 2 examples that may give you a headstart:

Single file structure

- stores
    - store1
        state.js
        getters.js
        mutations.js
        actions.js
        store.js
        index.js
    - store2
        state.js
        getters.js
        mutations.js
        actions.js
        store.js
        index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

Multi-file structure

- stores
    - store1
        - getters
            getter-1.js
            getter-2.js
        - mutations
            mutation-1.js
            mutation-2.js
        - actions
            action-1.js
            action-2.js
        state.js
        store.js
        index.js
    - store2
        - getters
            getter-1.js
            getter-2.js
        - mutations
            mutation-1.js
            mutation-2.js
        - actions
            action-1.js
            action-2.js
        state.js
        store.js
        index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

In both cases the store.js file and the index.js files would look roughly the same.

// store.js

import STATE from './state';

import {
    createStore
} from '@harlem/core';

export const {
    state,
    getter,
    mutation,
    ...store
} = createStore('store1', STATE);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
// index.js - single file structure

export { state } from './store';

export {
    getter1,
    getter2
} from './getters';

export {
    mutation1,
    mutation2
} from './mutations';
1
2
3
4
5
6
7
8
9
10
11
12
13
// index.js - multi-file structure

export { state } from './store';

export { default as getter1 } from './getters/getter-1';
export { default as getter2 } from './getters/getter-2';

export { default as mutation1 } from './mutations/mutation-1';
export { default as mutation2 } from './mutations/mutation-2';
1
2
3
4
5
6
7
8
9

Is Harlem suitable for large projects?

Absolutely! Harlem is currently being used by Fathomopen in new window to power their extensive financial intelligence product. The Fathom implementation consists of several stores with hundreds of getters, mutations and actions.

If you are using Harlem in a large project and would be comfortable in sharing your experience, please let me know.