open-consul/ui/packages/consul-ui/GNUmakefile
John Cowen fcacec90a5
ui: Change approach to loading debug.css (#12242)
We need a way to load certain CSS based on the environment you are viewing, i.e. we have debug CSS that we use for our Eng Documentation and various other DX utilities that shouldn't be compiled into our production or test builds.

Previously we would compile two entirely different CSS files (app and debug) and the load one or the other depending on which environment you were in.

This approach just empties out the debug.css file in certain environments (prod/test) which means we can just import that file from app. When in staging/development this imports the contents of debug.css (quite a bit of CSS) whereas when building for production/test this debug.css is emptied out during the build process.

There is a slight little hack in order to have this work, we import _debug.scss which imports the debug.scss file. I couldn't for the life of me figure out how to have broccoli empty out a file during the build process, so instead we essentially copy over debug.scss during dev and create an empty file during prod to _debug.scss.

When using make build to build an artifact for production CSS remains at ~58kb (during dev its a lot bigger than this)
2022-02-03 08:40:03 +00:00

87 lines
1.5 KiB
Makefile

ROOT:=$(shell dirname $(realpath $(lastword $(MAKEFILE_LIST))))
CONSUL_UI_INSTALL_FLAGS?=
all: build
deps: ../../node_modules clean
# incase we ever need to clean anything again
clean:
build-staging: deps
yarn run build:staging
build-ci: deps
yarn run build:ci --output-path=dist
build: deps
yarn run build
build-debug:
BROCCOLI_DEBUG=* $(MAKE) build
start: deps
yarn run start
start-consul: deps
yarn run start:consul
start-api: deps
yarn run start:api
# testing
# things with 'view' will open your browser for you
# otherwise its headless
# oss is currently with namespace support disabled
test: deps test-node
yarn run test
test-view: deps test-node
yarn run test:view
test-oss: deps test-node
yarn run test:oss
test-oss-view: deps test-node
yarn run test:oss:view
# these run from CI, both with and without namespaces
test-ci: deps test-node
yarn run test:ci
test-oss-ci: deps test-node
yarn run test:oss:ci
# these tests are only possible to run outside of ember
# and use node + tape for a test harness
test-node:
yarn run test:node
test-coverage: deps
yarn run test:coverage
test-coverage-view: deps
yarn run test:coverage:view
test-coverage-ci: deps
yarn run test:coverage:ci
test-parallel: deps
yarn run test:parallel
lint: deps
yarn run lint
format: deps
yarn run format
steps:
yarn run steps:list
../../node_modules: ../../yarn.lock package.json
yarn install $(CONSUL_UI_INSTALL_FLAGS)
.PHONY: all deps build start test test-view lint format clean