Skip to content
This repository was archived by the owner on Oct 18, 2018. It is now read-only.

Commit d8a6dff

Browse files
paulgvpaulgv
committed
feat: Initial commit
0 parents  commit d8a6dff

14 files changed

+9115
-0
lines changed

‎.circleci/config.yml

+39
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,39 @@
1+
version: 2
2+
jobs:
3+
build:
4+
working_directory: /usr/src/app
5+
docker:
6+
- image: banian/node
7+
steps:
8+
# Checkout repository
9+
- checkout
10+
11+
# Restore cache
12+
- restore_cache:
13+
key: yarn-{{ checksum "yarn.lock" }}
14+
15+
# Install dependencies
16+
- run:
17+
name: Install Dependencies
18+
command: NODE_ENV=dev yarn
19+
20+
# Keep cache
21+
- save_cache:
22+
key: yarn-{{ checksum "yarn.lock" }}
23+
paths:
24+
- "node_modules"
25+
26+
# ESLint
27+
- run:
28+
name: ESLint
29+
command: yarn eslint
30+
31+
# Test
32+
- run:
33+
name: Tests
34+
command: yarn test
35+
36+
# Coverage
37+
- run:
38+
name: Coverage
39+
command: yarn codecov

‎.editorconfig

+13
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
# editorconfig.org
2+
root = true
3+
4+
[*]
5+
indent_size = 2
6+
indent_style = space
7+
end_of_line = lf
8+
charset = utf-8
9+
trim_trailing_whitespace = true
10+
insert_final_newline = true
11+
12+
[*.md]
13+
trim_trailing_whitespace = false

‎.eslintrc.js

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
module.exports = {
2+
root: true,
3+
parserOptions: {
4+
sourceType: 'module'
5+
},
6+
env: {
7+
browser: true,
8+
node: true,
9+
jest: true
10+
},
11+
extends: 'airbnb-base',
12+
plugins: [
13+
'jest',
14+
'vue'
15+
],
16+
globals: {
17+
'jest/globals': true,
18+
jasmine: true
19+
}
20+
}

‎.gitignore

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
node_modules
2+
*.iml
3+
.idea
4+
*.log*
5+
.nuxt
6+
.vscode
7+
.DS_STORE
8+
coverage
9+
dist

‎LICENSE

+21
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
MIT License
2+
3+
Copyright (c) Paul Gascou-Vaillancourt <[email protected]>
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.

‎README.md

+178
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,178 @@
1+
# multisite-module
2+
[![npm (scoped with tag)](https://img.shields.io/npm/v/multisite-module/latest.svg?style=flat-square)](https://npmjs.com/package/multisite-module)
3+
[![npm](https://img.shields.io/npm/dt/multisite-module.svg?style=flat-square)](https://npmjs.com/package/multisite-module)
4+
[![CircleCI](https://img.shields.io/circleci/project/github/ax2inc/multisite-module.svg?style=flat-square)](https://circleci.com/gh/ax2inc/multisite-module)
5+
[![Codecov](https://img.shields.io/codecov/c/github/ax2inc/multisite-module.svg?style=flat-square)](https://codecov.io/gh/ax2inc/multisite-module)
6+
[![Dependencies](https://david-dm.org/ax2inc/multisite-module/status.svg?style=flat-square)](https://david-dm.org/ax2inc/multisite-module)
7+
[![Code Style](https://badgen.net/badge/code%20style/airbnb/ff5a5f?icon=airbnb)](https://github.com/airbnb/javascript)
8+
9+
10+
> Multisite features for your Nuxt project
11+
12+
[📖 **Release Notes**](./CHANGELOG.md)
13+
14+
## Features
15+
16+
This module helps you bring multisite features to your Nuxt project. Here are the main features:
17+
18+
- Current site detection based on host (or query string in development)
19+
- Contextual CSS vars declaration for site-specific theming
20+
- Contextual meta data
21+
22+
## Setup
23+
24+
- Install the module with your favorite package manager.
25+
26+
```sh
27+
yarn add multisite-module
28+
# Or npm i multisite-module
29+
```
30+
31+
- Add `multisite-module` to `modules` section of `nuxt.config.js`.
32+
33+
```js
34+
// nuxt.config.js
35+
36+
{
37+
modules: [
38+
'multisite-module',
39+
],
40+
}
41+
```
42+
43+
- Configure the module as needed by adding a `multisite` key to `nuxt.config.js`.
44+
45+
```js
46+
// nuxt.config.js
47+
48+
{
49+
multisite: {
50+
// Module options
51+
}
52+
}
53+
```
54+
55+
56+
## Options
57+
58+
### sites
59+
60+
- Type: `Array`
61+
62+
List of sites.
63+
64+
```js
65+
{
66+
multisite: {
67+
sites: [
68+
{
69+
id: 'my-site',
70+
title: 'My awesome site',
71+
isDefault: true,
72+
hostPatterns: 'myawesomesite\.com,myincrediblesite\.(com|org)',
73+
cssVars: {
74+
'--primary-color': '#41B883',
75+
'--secondary-color': '#3B8070',
76+
},
77+
head: {
78+
link: [
79+
{ rel: 'icon', type: 'image/x-icon', href: '/my-site/favicon.ico' },
80+
],
81+
},
82+
},
83+
],
84+
},
85+
}
86+
```
87+
88+
Each item in `sites` can have a few options of its own:
89+
90+
#### id
91+
92+
- Type: `Integer|String`
93+
94+
The site's unique identifier.
95+
96+
#### isDefault
97+
98+
- Type: `Boolean`
99+
100+
Wether this site should be considered as the default one. Any request that cannot be resolved to one of the sites will fallback to the default one.
101+
102+
#### hostPatterns
103+
104+
- Type: `String`
105+
106+
A list of comma-separated patterns to test against requests host in order to enable this site in production.
107+
108+
#### cssVars
109+
110+
- Type: `Object`
111+
112+
CSS vars that should be set when visiting this site.
113+
114+
#### head
115+
116+
- Type: `Object`
117+
118+
This is the same as Nuxt's [head property](https://nuxtjs.org/api/configuration-head#the-head-property), options defined here are merged with the main `head` property definition.
119+
120+
> NOTE: Functions are not supported here
121+
122+
## Usage
123+
124+
### Development
125+
126+
In development, switch from one site to another by adding a `site` query parameter to the URL. The value should be the site's ID as defined in the module's configuration. ie: [http://127.0.0.1:8080/?site=my-site](http://127.0.0.1:8080/?site=my-site)
127+
128+
Active site is stored in a cookie, so next time you visit [http://127.0.0.1:8080](http://127.0.0.1:8080), active site will be last used one.
129+
130+
### Production
131+
132+
In production, active site is detected by matching request host against the patterns you defined in `hostPatterns` options. ie if you visit [http://myawesomesite.com](http://myawesomesite.com), `my-site` will be set as active site.
133+
134+
A `$multisite` property is added to the app's context, it contains a few helpers that you can use in any component.
135+
136+
### Properties
137+
138+
#### site
139+
140+
- Type: `Object`
141+
142+
The `site` property contains current site's configuration. You could use it to display the current site's title:
143+
144+
```vue
145+
<template>
146+
<h1 class="site-title">
147+
{{ $multisite.site.title }}
148+
</h1>
149+
</template>
150+
```
151+
152+
### Methods
153+
154+
#### asset
155+
156+
- Arguments
157+
- `{String} path`: required
158+
- `{Integer|String} site`: optional, defaults to current site ID
159+
- Return: `String`
160+
161+
Get an asset's path for given site. If no site is specified, defaults to active site.
162+
163+
```vue
164+
<template>
165+
<header>
166+
<img class="logo" :src="$multisite.asset('logo.png')">
167+
<!-- Renders to <img class="logo" src="/my-site/logo.png"> -->
168+
</header>
169+
</template>
170+
```
171+
172+
> NOTE: It's recommended that you place site-specific assets in a directory named after the site's ID as defined in the module's options. Sites assets directories should be in the static/ directory.
173+
174+
## License
175+
176+
[MIT License](./LICENSE)
177+
178+
Copyright (c) Ax2 Inc.

‎lib/constants.js

+7
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,7 @@
1+
export const DEFAULT_OPTIONS = {
2+
sites: [],
3+
};
4+
5+
export const QUERY_SITE_ID_KEY = 'site';
6+
export const COOKIE_SITE_KEY = 'site';
7+
export const CSS_VARS_STYLE_ID = 'multisite-css-vars';

‎lib/module.js

+26
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
import {
2+
DEFAULT_OPTIONS,
3+
QUERY_SITE_ID_KEY,
4+
COOKIE_SITE_KEY,
5+
CSS_VARS_STYLE_ID,
6+
} from './constants';
7+
8+
const { resolve } = require('path');
9+
10+
module.exports = async function module(moduleOptions) {
11+
const options = Object.assign(DEFAULT_OPTIONS, this.options.multisite, moduleOptions);
12+
13+
const templatesOptions = {
14+
...options,
15+
QUERY_SITE_ID_KEY,
16+
COOKIE_SITE_KEY,
17+
CSS_VARS_STYLE_ID,
18+
};
19+
20+
this.addPlugin({
21+
src: resolve(__dirname, 'templates/plugin.js'),
22+
fileName: 'multisite-module/plugin.js',
23+
options: templatesOptions,
24+
});
25+
};
26+
module.exports.meta = require('../package.json');

0 commit comments

Comments
 (0)