relativeCI

Specialized insights for web bundles

Configure @relative-ci/agent webpack plugin

1. Configure Webpack

// webpack.config.js
const { RelativeCiAgentWebpackPlugin } = require('@relative-ci/agent');
module.exports = {
  // ...
  plugins: [
    // ...
    new RelativeCiAgentWebpackPlugin()  ]
};

Plugin options

  • enabled - send the stats to RelativeCI (default to env-ci isCi)
  • includeCommitMessage - will include git commit message (default true)
  • stats - Webpack stats options, default:
    {
      stats: {
        context: WEBPACK_CONTEXT,
        assets: true,
        entrypoints: true,
        chunks: true,
        modules: true,
      }
    }

Gatsby setup

// gatsby-node.js
const { RelativeCiAgentWebpackPlugin } = require('@relative-ci/agent');

exports.onCreateWebpackConfig = ({ stage, actions }) => {
  if (stage === 'build-javascript') {
    actions.setWebpackConfig({
      plugins: [
        new RelativeCiAgentWebpackPlugin()
      ]
    }
  }
}

Next.js setup

// next-config.js
const { RelativeCiAgentWebpackPlugin } = require('@relative-ci/agent');

module.exports = {
  webpack: function (config, options) {
    const { dev, isServer } = options;

    if (!dev && !isServer) {
      config.plugins.push(
        new RelativeCiAgentWebpackPlugin(),
      );
    }

    return config;
  }
}));

Need help configuring @relative-ci/agent for another framework?Contact us via Email, Twitter, or Github!

Debugging

To inspect @relative-ci/agent activity, set DEBUG=relative-ci:agent environment variable and run your build command:

$ DEBUG=relative-ci:agent npm run build

relative-ci:agent Config {
  config: {
    includeCommitMessage: true,
    webpack: { stats: './artifacts/webpack.json' }
  },
  filepath: '/repo/relativeci.config.js'
} +0ms

relative-ci:agent env-ci params {
  branch: 'master',
  build: 122,
  buildUrl: '#',
  commit: '2e201aa',
  isCi: true,
  pr: undefined,
  prBranch: undefined,
  slug: 'organization/project'
} +111ms

2. Configure Continuous Integration(CI) service

Add environment variables

RELATIVE_CI_KEY

(Requiered) Navigate to https://app.relative-ci.com and copy the project specific key from Project -> Settings -> Keys.

RELATIVE_CI_SLUG

(Requiered for unsupported CI services) Set your Github project slug (eg: webpack/webpack.js.org) if your CI service is not supported (https://github.com/pvdlg/env-ci#supported-ci).

Need help?Contact us via Email, Twitter, or Github!