├── .editorconfig ├── .eslintignore ├── .eslintrc.js ├── .gitignore ├── CHANGELOG.md ├── LICENSE.md ├── README.md ├── babel.config.js ├── commitlint.config.js ├── husky.config.js ├── jest.config.js ├── lib ├── module.js └── plugin.js ├── package.json ├── renovate.json ├── test ├── fixture │ ├── .env.default │ ├── nuxt.config.js │ └── pages │ │ └── index.vue └── module.test.js └── yarn.lock /.editorconfig: -------------------------------------------------------------------------------- 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 14 | -------------------------------------------------------------------------------- /.eslintignore: -------------------------------------------------------------------------------- 1 | # Common 2 | node_modules 3 | dist 4 | .nuxt 5 | coverage 6 | 7 | # Plugin 8 | lib/plugin.js 9 | -------------------------------------------------------------------------------- /.eslintrc.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | root: true, 3 | parserOptions: { 4 | parser: 'babel-eslint', 5 | sourceType: 'module' 6 | }, 7 | extends: [ 8 | '@nuxtjs' 9 | ] 10 | } 11 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | node_modules 2 | *.iml 3 | .idea 4 | *.log* 5 | .nuxt 6 | .vscode 7 | .DS_Store 8 | coverage 9 | dist 10 | .env 11 | -------------------------------------------------------------------------------- /CHANGELOG.md: -------------------------------------------------------------------------------- 1 | # Changelog 2 | 3 | All notable changes to this project will be documented in this file. See [standard-version](https://github.com/conventional-changelog/standard-version) for commit guidelines. 4 | 5 | ### [0.2.13](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.12...v0.2.13) (2022-03-11) 6 | 7 | 8 | ### Bug Fixes 9 | 10 | * shouldUseRouter() always return true ([0f27f61](https://github.com/dansmaculotte/nuxt-segment/commit/0f27f61e0fa0449fc188a5dd41f4a7a22e6efa0b)) 11 | * typo ([26bcb88](https://github.com/dansmaculotte/nuxt-segment/commit/26bcb882e24e7e044f5909c449ec50fbbc3c7f61)) 12 | 13 | ### [0.2.12](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.11...v0.2.12) (2022-02-24) 14 | 15 | 16 | ### Features 17 | 18 | * **config:** adding support of public runtime config ([0cf1c09](https://github.com/dansmaculotte/nuxt-segment/commit/0cf1c0948107b315f9f6001cb5816a53141491c1)) 19 | * **config:** adding support of public runtime config ([66a4858](https://github.com/dansmaculotte/nuxt-segment/commit/66a4858422a709a51cddbe2ae746c82cc9b01697)) 20 | 21 | ### [0.2.11](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.10...v0.2.11) (2020-04-21) 22 | 23 | ### [0.2.10](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.9...v0.2.10) (2019-11-20) 24 | 25 | ### [0.2.9](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.8...v0.2.9) (2019-11-20) 26 | 27 | ### [0.2.8](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.7...v0.2.8) (2019-11-19) 28 | 29 | 30 | ### Bug Fixes 31 | 32 | * remove promise and directly inject segment ([6959359](https://github.com/dansmaculotte/nuxt-segment/commit/695935956cbd6a1bacec0effbd4be0e3633755c9)) 33 | 34 | ### [0.2.7](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.6...v0.2.7) (2019-11-12) 35 | 36 | 37 | ### Features 38 | 39 | * inject $segment into nuxt context ([7a14088](https://github.com/dansmaculotte/nuxt-segment/commit/7a14088392b3c0c12020e40696e6de16b4f12b85)) 40 | 41 | ### [0.2.6](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.5...v0.2.6) (2019-10-06) 42 | 43 | ### [0.2.5](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.4...v0.2.5) (2019-07-18) 44 | 45 | 46 | 47 | ### [0.2.4](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.3...v0.2.4) (2019-05-29) 48 | 49 | 50 | ### Bug Fixes 51 | 52 | * change dev dependencies version to latest ([df001bc](https://github.com/dansmaculotte/nuxt-segment/commit/df001bc)) 53 | 54 | 55 | ### Tests 56 | 57 | * add load method to ensure segment can be post loaded ([1729c48](https://github.com/dansmaculotte/nuxt-segment/commit/1729c48)) 58 | 59 | 60 | 61 | ## [0.2.3](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.2...v0.2.3) (2019-05-04) 62 | 63 | 64 | ### Bug Fixes 65 | 66 | * update vue-segment to 0.2.3 ([c1de9cb](https://github.com/dansmaculotte/nuxt-segment/commit/c1de9cb)) 67 | 68 | 69 | 70 | ## [0.2.2](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.1...v0.2.2) (2019-05-04) 71 | 72 | 73 | ### Bug Fixes 74 | 75 | * update vue-segment to 0.2.2 ([b86ee8c](https://github.com/dansmaculotte/nuxt-segment/commit/b86ee8c)) 76 | 77 | 78 | 79 | ## [0.2.1](https://github.com/dansmaculotte/nuxt-segment/compare/v0.2.0...v0.2.1) (2019-05-04) 80 | 81 | 82 | ### Bug Fixes 83 | 84 | * rename id option with writeKey ([15f1c92](https://github.com/dansmaculotte/nuxt-segment/commit/15f1c92)) 85 | 86 | 87 | 88 | # [0.2.0](https://github.com/dansmaculotte/nuxt-segment/compare/v0.1.0...v0.2.0) (2019-05-04) 89 | 90 | 91 | ### Features 92 | 93 | * pass settings option to vue plugin ([ee00c37](https://github.com/dansmaculotte/nuxt-segment/commit/ee00c37)) 94 | 95 | 96 | 97 | # [0.1.0](https://github.com/dansmaculotte/nuxt-segment/compare/v0.0.4...v0.1.0) (2019-05-04) 98 | 99 | 100 | ### Features 101 | 102 | * add GDPR compliance ([a2d71af](https://github.com/dansmaculotte/nuxt-segment/commit/a2d71af)) 103 | 104 | 105 | 106 | ## [0.0.4](https://github.com/dansmaculotte/nuxt-segment/compare/v0.0.3...v0.0.4) (2019-05-03) 107 | 108 | 109 | 110 | ## [0.0.3](https://github.com/dansmaculotte/nuxt-segment/compare/v0.0.2...v0.0.3) (2019-04-04) 111 | 112 | 113 | ### Bug Fixes 114 | 115 | * Cannot set Vue prototype outside of plugin ([0956b0a](https://github.com/dansmaculotte/nuxt-segment/commit/0956b0a)) 116 | 117 | 118 | 119 | ## [0.0.2](https://github.com/dansmaculotte/nuxt-segment/compare/v0.0.1...v0.0.2) (2019-04-04) 120 | 121 | 122 | ### Bug Fixes 123 | 124 | * update bagde links ([85710a3](https://github.com/dansmaculotte/nuxt-segment/commit/85710a3)) 125 | * Update module path for nuxt.config.js ([1daaa12](https://github.com/dansmaculotte/nuxt-segment/commit/1daaa12)) 126 | 127 | 128 | 129 | ## 0.0.1 (2019-04-04) 130 | -------------------------------------------------------------------------------- /LICENSE.md: -------------------------------------------------------------------------------- 1 | # The MIT License (MIT) 2 | 3 | Copyright (c) Dans Ma Culotte 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. 22 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # nuxt-segment 2 | 3 | [![npm version][npm-version-src]][npm-version-href] 4 | [![npm downloads][npm-downloads-src]][npm-downloads-href] 5 | [![Dependencies][david-dm-src]][david-dm-href] 6 | [![Standard JS][standard-js-src]][standard-js-href] 7 | 8 | > Nuxt.js module for Segment Analytics 9 | 10 | This module uses [vue-segment](https://github.com/dansmaculotte/vue-segment) to add Segment Analytics to a Nuxt.js app. 11 | 12 | [📖 **Release Notes**](./CHANGELOG.md) 13 | 14 | ## Setup 15 | 16 | - Add `@dansmaculotte/nuxt-segment` dependency using yarn or npm to your project 17 | - Add `@dansmaculotte/nuxt-segment` to `modules` section of `nuxt.config.js` 18 | 3. Configure it: 19 | 20 | ```js 21 | { 22 | modules: [ 23 | // Simple usage 24 | '@dansmaculotte/nuxt-segment', 25 | 26 | // With options 27 | [ 28 | '@dansmaculotte/nuxt-segment', 29 | { /* module options */ } 30 | ], 31 | ], 32 | 33 | // Or with global options 34 | segment: { 35 | writeKey: '', 36 | disabled: false, 37 | useRouter: true 38 | } 39 | 40 | // Or with publicRuntimeConfig 41 | 42 | publicRuntimeConfig: { 43 | SEGMENT_WRITE_KEY: process.env.SEGMENT_WRITE_KEY_FROM_SERVER || '', 44 | SEGMENT_DISABLED: process.env.SEGMENT_DISBLED_FROM_SERVER || false, 45 | SEGMENT_USE_ROUTER: process.env.SEGMENT_USE_ROUTER_FROM_SERVER || true, 46 | } 47 | } 48 | ``` 49 | 50 | ## Options 51 | 52 | ### writeKey 53 | 54 | - Type: `String` 55 | - Default: `process.env.SEGMENT_WRITE_KEY || publicRuntimeConfig.SEGMENT_WRITE_KEY` 56 | 57 | ### disabled 58 | 59 | - Type: `Boolean` 60 | - Default: `process.env.SEGMENT_DISABLED || publicRuntimeConfig.SEGMENT_DISABLED || false` 61 | 62 | ### useRouter 63 | 64 | - Type: `Boolean` 65 | - Default: `process.env.SEGMENT_USE_ROUTER || publicRuntimeConfig.SEGMENT_USE_ROUTER || true` 66 | 67 | ## Usage 68 | 69 | Inside a Vue component, the Segment `analytics` object is available as `this.$segment`: 70 | 71 | ```js 72 | export default { 73 | mounted () { 74 | this.$segment.identify('f4ca124298', { 75 | name: 'Michael Bolton', 76 | email: 'mbolton@initech.com' 77 | }); 78 | this.$segment.track('Signed Up', { plan: 'Enterprise' }); 79 | this.$segment.page('Pricing'); 80 | } 81 | } 82 | ``` 83 | 84 | `$segment` is also injected into the [Nuxt context](https://nuxtjs.org/api/context/) so you can access it within your Vuex stores: 85 | 86 | ```js 87 | export default { 88 | LOGOUT({ dispatch }) { 89 | return this.$auth.logout() 90 | .then(() => { 91 | this.$segment.reset(); 92 | return dispatch('AFTER_LOGOUT'); 93 | }) 94 | } 95 | } 96 | ``` 97 | 98 | 99 | ## Development 100 | 101 | - Clone this repository 102 | - Install dependencies using `yarn install` 103 | - Start development server using `npm run dev` 104 | 105 | ## License 106 | 107 | [MIT License](./LICENSE.md) 108 | 109 | 110 | [npm-downloads-src]: https://img.shields.io/npm/dt/@dansmaculotte/nuxt-segment.svg?style=flat-square 111 | [npm-downloads-href]: https://npmjs.com/package/@dansmaculotte/nuxt-segment 112 | 113 | [npm-version-src]: https://img.shields.io/npm/v/@dansmaculotte/nuxt-segment/latest.svg?style=flat-square 114 | [npm-version-href]: https://npmjs.com/package/@dansmaculotte/nuxt-segment 115 | 116 | [david-dm-src]: https://david-dm.org/dansmaculotte/nuxt-segment/status.svg?style=flat-square 117 | [david-dm-href]: https://david-dm.org/dansmaculotte/nuxt-segment 118 | 119 | [standard-js-src]: https://img.shields.io/badge/code_style-standard-brightgreen.svg?style=flat-square 120 | [standard-js-href]: https://standardjs.com 121 | -------------------------------------------------------------------------------- /babel.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | presets: [ 3 | [ 4 | '@babel/preset-env', { 5 | targets: { 6 | esmodules: true 7 | } 8 | } 9 | ] 10 | ] 11 | } 12 | -------------------------------------------------------------------------------- /commitlint.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | extends: [ 3 | '@commitlint/config-conventional' 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /husky.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | hooks: { 3 | 'commit-msg': 'commitlint -E HUSKY_GIT_PARAMS', 4 | 'pre-commit': 'yarn lint', 5 | 'pre-push': 'yarn lint' 6 | } 7 | } 8 | -------------------------------------------------------------------------------- /jest.config.js: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | testEnvironment: 'node', 3 | collectCoverage: true, 4 | collectCoverageFrom: [ 5 | 'lib/**/*.js', 6 | '!lib/plugin.js' 7 | ], 8 | moduleNameMapper: { 9 | '^~/(.*)$': '/lib/$1', 10 | '^~~$': '', 11 | '^@@$': '', 12 | '^@/(.*)$': '/lib/$1' 13 | }, 14 | transform: { 15 | '^.+\\.js$': 'babel-jest' 16 | } 17 | } 18 | -------------------------------------------------------------------------------- /lib/module.js: -------------------------------------------------------------------------------- 1 | const { resolve } = require('path') 2 | 3 | export default function (moduleOptions) { 4 | const options = Object.assign( 5 | { 6 | writeKey: process.env.SEGMENT_WRITE_KEY, 7 | disabled: process.env.SEGMENT_DISABLED, 8 | useRouter: process.env.SEGMENT_USE_ROUTER, 9 | settings: {} 10 | }, 11 | this.options.segment, 12 | moduleOptions 13 | ) 14 | 15 | const pluginOpts = { 16 | src: resolve(__dirname, 'plugin.js'), 17 | fileName: 'nuxt-segment.js', 18 | ssr: false, 19 | options 20 | } 21 | 22 | this.addPlugin(pluginOpts) 23 | } 24 | -------------------------------------------------------------------------------- /lib/plugin.js: -------------------------------------------------------------------------------- 1 | import Vue from 'vue' 2 | import Segment from '@dansmaculotte/vue-segment' 3 | 4 | function shouldUseRouter(moduleOptions, $config) { 5 | return moduleOptions.useRouter ?? $config.SEGMENT_USE_ROUTER ?? true 6 | } 7 | 8 | const OPTIONS = '<%= JSON.stringify(options) %>' 9 | 10 | export default function (context, inject) { 11 | const { app, store, $config } = context 12 | 13 | const moduleOptions = JSON.parse(OPTIONS) 14 | 15 | const options = { 16 | writeKey: moduleOptions.writeKey || ($config && $config.SEGMENT_WRITE_KEY), 17 | disabled: moduleOptions.disabled || ($config && $config.SEGMENT_DISABLED) || false, 18 | settings: moduleOptions.settings, 19 | } 20 | 21 | const useRouter = shouldUseRouter(moduleOptions, $config) 22 | 23 | if (useRouter && app.router) { 24 | options.router = app.router 25 | } 26 | 27 | Vue.use(Segment, options) 28 | 29 | if (store) { 30 | store.$segment = Vue.$segment 31 | } 32 | 33 | context.$segment = Vue.$segment 34 | 35 | if (Vue.$segment) { 36 | inject('segment', Vue.$segment) 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "@dansmaculotte/nuxt-segment", 3 | "version": "0.2.13", 4 | "description": "Nuxt.js module for Segment Analytics.js", 5 | "license": "MIT", 6 | "contributors": [ 7 | { 8 | "name": "Dylan Wight", 9 | "email": "dylan@otechie.com" 10 | }, 11 | { 12 | "name": "Gaël Reyrol", 13 | "email": "gael@dansmaculotte.fr" 14 | } 15 | ], 16 | "main": "lib/module.js", 17 | "repository": "https://github.com/dansmaculotte/nuxt-segment", 18 | "publishConfig": { 19 | "access": "public" 20 | }, 21 | "scripts": { 22 | "dev": "nuxt test/fixture", 23 | "lint": "eslint lib test", 24 | "test": "yarn run lint && jest", 25 | "release": "standard-version && git push --follow-tags && npm publish" 26 | }, 27 | "files": [ 28 | "lib" 29 | ], 30 | "dependencies": { 31 | "@dansmaculotte/vue-segment": "^0.2.9" 32 | }, 33 | "devDependencies": { 34 | "@babel/core": "7.12.10", 35 | "@babel/preset-env": "7.12.11", 36 | "@commitlint/cli": "11.0.0", 37 | "@commitlint/config-conventional": "11.0.0", 38 | "@nuxtjs/dotenv": "latest", 39 | "@nuxtjs/eslint-config": "5.0.0", 40 | "babel-eslint": "10.1.0", 41 | "babel-jest": "26.6.3", 42 | "codecov": "3.8.1", 43 | "dotenv": "^16.0.0", 44 | "eslint": "7.17.0", 45 | "eslint-config-standard": "16.0.2", 46 | "eslint-plugin-import": "2.22.1", 47 | "eslint-plugin-jest": "24.1.3", 48 | "eslint-plugin-node": "11.1.0", 49 | "eslint-plugin-promise": "^6.0.0", 50 | "eslint-plugin-standard": "5.0.0", 51 | "eslint-plugin-vue": "7.4.1", 52 | "get-port": "5.1.1", 53 | "husky": "4.3.7", 54 | "jest": "26.6.3", 55 | "nuxt-edge": "2.15.0-26840219.3265e949", 56 | "request": "2.88.2", 57 | "request-promise-native": "1.0.9", 58 | "standard-version": "9.1.0" 59 | } 60 | } 61 | -------------------------------------------------------------------------------- /renovate.json: -------------------------------------------------------------------------------- 1 | { 2 | "extends": [ 3 | "@nuxtjs" 4 | ] 5 | } 6 | -------------------------------------------------------------------------------- /test/fixture/.env.default: -------------------------------------------------------------------------------- 1 | SEGMENT_WRITE_KEY= 2 | SEGMENT_DISABLED= 3 | SEGMENT_USE_ROUTER= 4 | -------------------------------------------------------------------------------- /test/fixture/nuxt.config.js: -------------------------------------------------------------------------------- 1 | const { resolve } = require('path') 2 | require('dotenv').config({ 3 | path: resolve(__dirname, '.env') 4 | }) 5 | 6 | module.exports = { 7 | rootDir: resolve(__dirname, '../..'), 8 | buildDIr: resolve(__dirname, '.nuxt'), 9 | srcDir: __dirname, 10 | render: { 11 | resourceHints: false 12 | }, 13 | modules: [ 14 | '@nuxtjs/dotenv', 15 | '@@' 16 | ] 17 | } 18 | -------------------------------------------------------------------------------- /test/fixture/pages/index.vue: -------------------------------------------------------------------------------- 1 | 9 | 10 | 30 | -------------------------------------------------------------------------------- /test/module.test.js: -------------------------------------------------------------------------------- 1 | jest.setTimeout(60000) 2 | 3 | const { Nuxt, Builder } = require('nuxt-edge') 4 | const request = require('request-promise-native') 5 | const getPort = require('get-port') 6 | 7 | const config = require('./fixture/nuxt.config') 8 | config.dev = false 9 | 10 | let nuxt, port 11 | 12 | const url = path => `http://localhost:${port}${path}` 13 | const get = path => request(url(path)) 14 | 15 | describe('basic', () => { 16 | beforeAll(async () => { 17 | nuxt = new Nuxt(config) 18 | await nuxt.ready() 19 | await new Builder(nuxt).build() 20 | port = await getPort() 21 | await nuxt.listen(port) 22 | }) 23 | 24 | afterAll(async () => { 25 | await nuxt.close() 26 | }) 27 | 28 | test('render', async () => { 29 | const html = await get('/') 30 | expect(html).toContain('Works!') 31 | }) 32 | }) 33 | --------------------------------------------------------------------------------