vue-cli-plugin-gitlab-pages

Gitlab CI plugin for vue-cli

This plugin generates a Gitlab CI config (gitlab-ci.yml) that will enable build, linting, unit testing and automatic deployment to Gitlab Pages.

Configuration Options

Upon installation the plugin will prompt for several options.

ciBranch

This is the remote branch the pipeline will watch for changes. Commits to this branch will trigger the pipeline.

Defaults to master

NOTE: This mean changes to this branch will be deploy publicly.
nodeVersion

The version of the node image to use for building on the CI pipeline.

Defaults to latest
enableLinting

This enables the linting CI stage. Also adds a ci:lint service that will fail the pipeline on linter warnings.

Requires a service lint

Defaults to true
enableUnitTesting

This enables the unit testing CI stage.

Requires a service test:unit

Defaults to true
writeVueConfig

By default Gitlab Pages will deploy to https://<username>.gitlab.io/<project_name>. For the Vue app to work in this default config, the production publicPath of the vue app must be set to /<project_name>.

This option will write a vue.config.js file, that sets the publicPath for production builds to /<project_name> using the name found in the package.json.

Defaults to false to avoid breaking vue.config.js

Modifying the publicPath can be done manually in a variety of ways (package.json, vue.config.js, .env.*, etc) and is independent of the Gitlab CI configuration and can be set in any of those ways.

## Installing in an Already Created Project

vue add gitlab-pages

## Troubleshooting

If the pipeline succeeds but the pages url displays a blank page with errors such as:

Refused to apply style ... because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

Check that the publicPath matches the deployment path.