Netlify Deployment

Create the Netlify site‌

Netlify is weird in that you have to create the site either from a git repo, or the CLI. You can't create a Netlify site from the UI without tying it to a git repo.

1. Checkout the project and run the build process. The build must produce a dist or distribution folder that contains all the files that need to be deployed. There must be a gulp or grunt task that can run the build without going into watch mode. Typically, this is gulp build.

2. Deploy the built files to a new site: netlify deploy --dir=./dist --prod, where dist is the relative path to the distribution.

3. You may need to log in to the Netlify account.

4. Select Create & configure a new site

5. Follow the prompts. Select the Blend team, and give the site a unique name.

6. Add .netlify to the .gitignore file, and commit the updated ignore file.‌

The siteId is in a new file, in the .\netlify\state.json path. Open the file and make note of the siteId, as you'll need in the next steps.

Create the DevOps step

Create a new Azure DevOps pipeline for the Netlify build. Note: The following build expects Netlify CLI to be saved as a project dependency in your packages.json, then runs that Netlify version from the node_modules folder rather than installing Netlify as a global tool, which seems to cause some issues.

First, you'll want to create an Azure DevOps pipeline YAML file and commit it to your repository. Something like this, named azure-pipelines.yml:

trigger:
- master
 
pool:
 vmImage: 'windows-latest'
 
steps:
- task: Npm@1
 inputs:
 command: 'install'
 
- task: gulp@0
 inputs:
 gulpFile: 'gulpfile.js'
 targets: 'build'
 gulpjs: 'node_modules/gulp/bin/gulp.js'
 enableCodeCoverage: false

- script: |
 .\node_modules\netlify-cli\bin\run deploy --dir=./static/dist --site=e425b84a-0dc6-4014-8081-fa308b8d0eec --auth=$(netlifyAuthToken) --prod

Next, you'll need to create the pipeline in DevOps.‌

1. Go to the pipelines section and create a new pipeline.

2. Select the Azure Repos Git and select your repository.

3. Select Existing Azure Pipelines YAML file.

4. Create one variable called netlifyAuthToken. The value for this variable can be found in 1Password, in the notes section.

5. Save and run the pipeline.