Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: publish @geprog/vite-plugin-env-config #1

Merged
merged 3 commits into from
Jan 24, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions .eslintignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
dist/
coverage/
17 changes: 17 additions & 0 deletions .eslintrc.cjs
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
/* eslint-env node */

require('@geprog/eslint-config/patch/modern-module-resolution');

module.exports = {
extends: ['@geprog', '@geprog/eslint-config/jest'],

env: {
'shared-node-browser': true,
},

parserOptions: {
project: ['./tsconfig.eslint.json'],
tsconfigRootDir: __dirname,
extraFileExtensions: ['.cjs'],
},
};
17 changes: 17 additions & 0 deletions .github/workflows/lint-pr.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,17 @@
name: 'Lint PR'

on:
pull_request_target:
types:
- opened
- edited
- synchronize

jobs:
main:
runs-on: ubuntu-latest
steps:
# https://github.com/amannn/action-semantic-pull-request/releases
- uses: amannn/action-semantic-pull-request@v3.4.0
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
43 changes: 43 additions & 0 deletions .github/workflows/release.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
name: Release

on:
push:
branches:
- main

jobs:
release:
name: Release
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
with:
fetch-depth: 0

- name: Setup Node.js
uses: actions/setup-node@v2
with:
node-version: '14'

- name: Cache pnpm modules
uses: actions/cache@v2
with:
path: ~/.pnpm-store
key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-

- uses: pnpm/action-setup@v2.0.1
with:
version: 6
run_install: true

- name: Build
run: pnpm run build

- name: Release
env:
GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
NPM_TOKEN: ${{ secrets.NPM_TOKEN }}
run: pnpm run release
135 changes: 135 additions & 0 deletions .github/workflows/tests.yml
Original file line number Diff line number Diff line change
@@ -0,0 +1,135 @@
name: Tests
on:
pull_request:
branches:
- main
push:
branches:
- main

jobs:
unit-tests:
name: Unit tests
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
with:
fetch-depth: 0

- name: Setup Node.js
uses: actions/setup-node@v2
with:
node-version: '14'

- name: Cache pnpm modules
uses: actions/cache@v2
with:
path: ~/.pnpm-store
key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-

- uses: pnpm/action-setup@v2.0.1
with:
version: 6
run_install: true

- name: Unit test
run: pnpm run test

- uses: artiomtr/jest-coverage-report-action@v2.0-rc.1
if: "github.event_name == 'pull_request'"
with:
github-token: ${{ secrets.GITHUB_TOKEN }}
skip-step: all

typecheck:
name: Typecheck
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
with:
fetch-depth: 0

- name: Setup Node.js
uses: actions/setup-node@v2
with:
node-version: '14'

- name: Cache pnpm modules
uses: actions/cache@v2
with:
path: ~/.pnpm-store
key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-

- uses: pnpm/action-setup@v2.0.1
with:
version: 6
run_install: true

- name: Typecheck
run: pnpm run typecheck

lint:
name: Lint
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
with:
fetch-depth: 0

- name: Setup Node.js
uses: actions/setup-node@v2
with:
node-version: '14'

- name: Cache pnpm modules
uses: actions/cache@v2
with:
path: ~/.pnpm-store
key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-

- uses: pnpm/action-setup@v2.0.1
with:
version: 6
run_install: true

- name: Lint
run: pnpm run lint

check-format:
name: Check format
runs-on: ubuntu-latest
steps:
- name: Checkout
uses: actions/checkout@v2
with:
fetch-depth: 0

- name: Setup Node.js
uses: actions/setup-node@v2
with:
node-version: '14'

- name: Cache pnpm modules
uses: actions/cache@v2
with:
path: ~/.pnpm-store
key: ${{ runner.os }}-${{ hashFiles('**/pnpm-lock.yaml') }}
restore-keys: |
${{ runner.os }}-

- uses: pnpm/action-setup@v2.0.1
with:
version: 6
run_install: true

- name: Check format
run: pnpm run lint:format
7 changes: 7 additions & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,7 @@
node_modules
dist
coverage/
junit.xml
*.tgz
report.json
.pnpm-debug.log
4 changes: 4 additions & 0 deletions .prettierignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
dist/
coverage/
pnpm-lock.yaml
report.json
8 changes: 8 additions & 0 deletions .prettierrc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
{
"semi": true,
"trailingComma": "all",
"singleQuote": true,
"printWidth": 120,
"tabWidth": 2,
"endOfLine": "lf"
}
3 changes: 3 additions & 0 deletions .releaserc.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
{
"extends": "@geprog/semantic-release-config"
}
63 changes: 63 additions & 0 deletions README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
# @geprog/vite-plugin-env-config

Vite plugin for providing configurations from environment variables at runtime.

## Usage

Add `envConfig` plugin to `vite.config.js / vite.config.ts`:

```js
// vite.config.js / vite.config.ts
import { envConfig } from '@geprog/vite-plugin-env-config';

export default {
plugins: [envConfig()],
};
```

Add a template file to your project at `./src/assets/env-config.template.js`:

```js
// ./src/assets/env-config.template.js
(function (window) {
window.env = window.env || {};

// add a line for each environment variable
window['env']['BACKEND_URL'] = '${BACKEND_URL}';
})(this);
```

Include `/assets/env-config.js` in your `index.html`:

```html
<!-- index.html -->
<!DOCTYPE html>
<html lang="en">
<head>
<script src="/assets/env-config.js"></script>
</head>
</html>
```

To access the environment variables use the built-in getter:

```ts
import { getEnvConfig } from '@geprog/vite-plugin-env-config';
anbraten marked this conversation as resolved.
Show resolved Hide resolved

const backendURL = getEnvConfig('BACKEND_URL');
```

For production use `envsubst` as outlined in the [next section](#motivation).

## Motivation

To adhere to the principles of the [twelve-factor app](https://12factor.net/config)
you might need to access environment variables that are set when your frontend server starts.
Instead of building your frontend on startup,
you can use a config template like the one above and populate it using `envsubst`:

```Dockerfile
CMD ["/bin/sh", "-c", "envsubst < ./src/assets/env-config.template.js > ./dist/assets/env-config.js && exec nginx -g 'daemon off;'"]
```

`@geprog/vite-plugin-env-config` provides the same functionality for your development environment.
22 changes: 22 additions & 0 deletions jest.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
import { Config } from '@jest/types';
import { pathsToModuleNameMapper } from 'ts-jest/utils';

import { compilerOptions } from './tsconfig.json';

const moduleNameMapper = {
...pathsToModuleNameMapper(compilerOptions.paths, {
prefix: '<rootDir>/' + compilerOptions.baseUrl + '/',
}),
} as Config.InitialOptions['moduleNameMapper'];

const config: Config.InitialOptions = {
preset: 'ts-jest',
roots: ['<rootDir>/test'],
moduleNameMapper,
testEnvironment: 'jest-environment-jsdom',
collectCoverage: true,
coverageReporters: ['json'],
testLocationInResults: true,
};

export default config;
56 changes: 56 additions & 0 deletions package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,56 @@
{
"name": "@geprog/vite-plugin-env-config",
"version": "0.0.0-semantic-release",
"description": "Vite Plugin for providing config from environment variables at runtime",
"homepage": "https://geprog.com",
"repository": "github:geprog/vite-plugin-env-config",
"license": "MIT",
"exports": {
".": {
"import": "./dist/index.esm.js",
"require": "./dist/index.cjs.js"
}
},
"main": "./dist/index.cjs.js",
"module": "./dist/index.esm.js",
"types": "./dist/index.d.ts",
"files": [
"/dist"
],
"scripts": {
"build": "rollup -c rollup.config.ts --configPlugin rollup-plugin-typescript2",
"clean": "rm -rf dist/ node_modules/",
"lint": "eslint --max-warnings 0 .",
"lint:format": "prettier --check .",
"start": "pnpm run build -- --watch",
"test": "jest --forceExit --detectOpenHandles --testLocationInResults --json --outputFile=report.json",
"test:watch": "pnpm run test -- --watch",
"typecheck": "tsc --noEmit",
"release": "semantic-release"
},
"devDependencies": {
"@geprog/eslint-config": "0.0.1",
"@geprog/semantic-release-config": "1.0.0",
"@jest/types": "26.6.2",
"@types/jest": "26.0.23",
"@types/node": "17.0.10",
"eslint": "7.29.0",
"jest": "26.6.3",
"prettier": "2.3.1",
"rollup": "2.60.2",
"rollup-plugin-dts": "4.0.1",
"rollup-plugin-typescript2": "0.31.1",
"semantic-release": "18.0.0",
"ts-jest": "26.5.6",
"ts-node": "10.0.0",
"tslib": "2.3.1",
"typescript": "4.5.2",
"vite": "2.7.13"
},
"peerDependencies": {
"vite": "^2.0.0"
},
"publishConfig": {
"access": "public"
}
}
Loading