feat: use pnpm #1789

Merged
konrad merged 7 commits from dpschen/frontend:feature/feat-use-pnpm into main 2022-09-21 20:49:14 +00:00
11 changed files with 13397 additions and 13600 deletions

View File

@ -29,26 +29,91 @@ steps:
# AWS_SECRET_ACCESS_KEY: # AWS_SECRET_ACCESS_KEY:
# from_secret: cache_aws_secret_access_key # from_secret: cache_aws_secret_access_key
# settings: # settings:
# debug: true
# restore: true # restore: true
# bucket: kolaente.dev-drone-dependency-cache # bucket: kolaente.dev-drone-dependency-cache
# endpoint: https://s3.fr-par.scw.cloud # endpoint: https://s3.fr-par.scw.cloud
# region: fr-par # region: fr-par
# path_style: true # path_style: true
# cache_key: '{{ .Repo.Name }}_{{ checksum "yarn.lock" }}_{{ arch }}_{{ os }}' # cache_key: '{{ .Repo.Name }}_{{ checksum "pnpm-lock.yaml" }}_{{ arch }}_{{ os }}'
# mount: # mount:
# - '.cache' # - .cache
- name: dependencies - name: dependencies
image: node:18 image: node:18-alpine
pull: true pull: true
environment: environment:
YARN_CACHE_FOLDER: .cache/yarn/ PNPM_CACHE_FOLDER: .cache/pnpm
CYPRESS_CACHE_FOLDER: .cache/cypress/ CYPRESS_CACHE_FOLDER: .cache/cypress
Review

Does it work if you re-add the / at the end?

Does it work if you re-add the `/` at the end?
Review

Probably not:
https://docs.cypress.io/guides/references/advanced-installation#Binary-cache

If I remember correctly removing the / was already a test. I guess both works.
Since the version without / is mentioned in the docs I kept that.

Probably not: https://docs.cypress.io/guides/references/advanced-installation#Binary-cache If I remember correctly removing the `/` was already a test. I guess both works. Since the version without `/` is mentioned in the docs I kept that.
commands: commands:
- yarn --frozen-lockfile --network-timeout 100000 - corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/pnpm
- pnpm install --fetch-timeout 100000
# depends_on: # depends_on:
# - restore-cache # - restore-cache
- name: lint
image: node:18-alpine
pull: true
environment:
PNPM_CACHE_FOLDER: .cache/pnpm
commands:
- corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/pnpm
- pnpm run lint
depends_on:
- dependencies
- name: build-prod
image: node:18-alpine
pull: true
environment:
PNPM_CACHE_FOLDER: .cache/pnpm
commands:
- corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/pnpm
- pnpm run build
depends_on:
- dependencies
- name: test-unit
image: node:18-alpine
pull: true
commands:
- corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/pnpm
- pnpm run test:unit
depends_on:
- dependencies
- name: typecheck
failure: ignore
image: node:18-alpine
pull: true
environment:
PNPM_CACHE_FOLDER: .cache/pnpm
commands:
- corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/pnpm
- pnpm run typecheck
depends_on:
- dependencies
- name: test-frontend
image: cypress/browsers:node16.14.0-chrome99-ff97
pull: true
environment:
CYPRESS_API_URL: http://api:3456/api/v1
CYPRESS_TEST_SECRET: averyLongSecretToSe33dtheDB
PNPM_CACHE_FOLDER: .cache/pnpm
CYPRESS_CACHE_FOLDER: .cache/cypress
CYPRESS_DEFAULT_COMMAND_TIMEOUT: 60000
CYPRESS_RECORD_KEY:
from_secret: cypress_project_key
commands:
- sed -i 's/localhost/api/g' dist/index.html
- corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/pnpm
- pnpm cypress install
- pnpm run serve:dist & npx wait-on http://localhost:4173
- pnpm run test:frontend --browser chrome --record
depends_on:
- build-prod
# - name: rebuild-cache # - name: rebuild-cache
# image: meltwater/drone-cache:dev # image: meltwater/drone-cache:dev
# pull: true # pull: true
@ -63,70 +128,14 @@ steps:
# endpoint: https://s3.fr-par.scw.cloud # endpoint: https://s3.fr-par.scw.cloud
# region: fr-par # region: fr-par
# path_style: true # path_style: true
# cache_key: '{{ .Repo.Name }}_{{ checksum "yarn.lock" }}_{{ arch }}_{{ os }}' # cache_key: '{{ .Repo.Name }}_{{ checksum "pnpm-lock.yaml" }}_{{ arch }}_{{ os }}'
# mount: # mount:
# - '.cache' # - .cache
# depends_on: # depends_on:
# - dependencies # - dependencies
- name: lint
image: node:18
pull: true
environment:
YARN_CACHE_FOLDER: .cache/yarn/
CYPRESS_CACHE_FOLDER: .cache/cypress/
commands:
- yarn run lint
depends_on:
- dependencies
- name: build-prod
image: node:18
pull: true
environment:
YARN_CACHE_FOLDER: .cache/yarn/
commands:
- yarn build
depends_on:
- dependencies
- name: test-unit
image: node:18
pull: true
commands:
- yarn test:unit
depends_on:
- dependencies
- name: typecheck
failure: ignore
image: node:18
pull: true
commands:
- yarn typecheck
depends_on:
- dependencies
- name: test-frontend
image: cypress/browsers:node16.14.0-chrome99-ff97
pull: true
environment:
CYPRESS_API_URL: http://api:3456/api/v1
CYPRESS_TEST_SECRET: averyLongSecretToSe33dtheDB
YARN_CACHE_FOLDER: .cache/yarn/
CYPRESS_CACHE_FOLDER: .cache/cypress/
CYPRESS_DEFAULT_COMMAND_TIMEOUT: 60000
CYPRESS_RECORD_KEY:
from_secret: cypress_project_key
commands:
- sed -i 's/localhost/api/g' dist/index.html
- yarn serve:dist & npx wait-on http://localhost:4173
- yarn test:frontend --browser chrome --record
depends_on:
- build-prod
- name: deploy-preview - name: deploy-preview
image: node:18 image: node:18-alpine
pull: true pull: true
environment: environment:
NETLIFY_AUTH_TOKEN: NETLIFY_AUTH_TOKEN:
@ -139,6 +148,7 @@ steps:
- cp -r dist dist-preview - cp -r dist dist-preview
# Override the default api url used for preview # Override the default api url used for preview
- sed -i 's|localhost:3456|try.vikunja.io|g' dist-preview/index.html - sed -i 's|localhost:3456|try.vikunja.io|g' dist-preview/index.html
- apk add --no-cache perl-utils
- shasum -a 384 -c ./scripts/deploy-preview-netlify.js.sha384 - shasum -a 384 -c ./scripts/deploy-preview-netlify.js.sha384
- node ./scripts/deploy-preview-netlify.js - node ./scripts/deploy-preview-netlify.js
depends_on: depends_on:
@ -181,21 +191,22 @@ steps:
# endpoint: https://s3.fr-par.scw.cloud # endpoint: https://s3.fr-par.scw.cloud
# region: fr-par # region: fr-par
# path_style: true # path_style: true
# cache_key: '{{ .Repo.Name }}_{{ checksum "yarn.lock" }}_{{ arch }}_{{ os }}' # cache_key: '{{ .Repo.Name }}_{{ checksum "pnpm-lock.yaml" }}_{{ arch }}_{{ os }}'
# mount: # mount:
# - '.cache' # - .cache
- name: build - name: build
image: node:18 image: node:18-alpine
pull: true pull: true
group: build-static group: build-static
environment: environment:
YARN_CACHE_FOLDER: .cache/yarn/ PNPM_CACHE_FOLDER: .cache/pnpm
commands: commands:
- yarn --frozen-lockfile --network-timeout 100000 - corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/.pnp
- yarn run lint - pnpm install --fetch-timeout 100000
- pnpm run lint
- "echo '{\"VERSION\": \"'$(git describe --tags --always --abbrev=10 | sed 's/-/+/' | sed 's/^v//' | sed 's/-g/-/')'\"}' > src/version.json" - "echo '{\"VERSION\": \"'$(git describe --tags --always --abbrev=10 | sed 's/-/+/' | sed 's/^v//' | sed 's/-g/-/')'\"}' > src/version.json"
- yarn run build - pnpm run build
- sed -i 's/http\:\\/\\/localhost\\:3456\\/api\\/v1/\\/api\\/v1/g' dist/index.html # Override the default api url used for developing - sed -i 's/http\:\\/\\/localhost\\:3456\\/api\\/v1/\\/api\\/v1/g' dist/index.html # Override the default api url used for developing
# depends_on: # depends_on:
# - restore-cache # - restore-cache
@ -256,21 +267,22 @@ steps:
# endpoint: https://s3.fr-par.scw.cloud # endpoint: https://s3.fr-par.scw.cloud
# region: fr-par # region: fr-par
# path_style: true # path_style: true
# cache_key: '{{ .Repo.Name }}_{{ checksum "yarn.lock" }}_{{ arch }}_{{ os }}' # cache_key: '{{ .Repo.Name }}_{{ checksum "pnpm-lock.yaml" }}_{{ arch }}_{{ os }}'
# mount: # mount:
# - '.cache' # - .cache
- name: build - name: build
image: node:18 image: node:18-alpine
pull: true pull: true
group: build-static group: build-static
environment: environment:
YARN_CACHE_FOLDER: .cache/yarn/ PNPM_CACHE_FOLDER: .cache/pnpm
commands: commands:
- yarn --frozen-lockfile --network-timeout 100000 - corepack enable && corepack prepare pnpm@7.9.3 --activate && pnpm config set store-dir .cache/pnpm
- yarn run lint - pnpm install --fetch-timeout 100000
- pnpm run lint
- "echo '{\"VERSION\": \"'$(git describe --tags --always --abbrev=10 | sed 's/-/+/' | sed 's/^v//' | sed 's/-g/-/')'\"}' > src/version.json" - "echo '{\"VERSION\": \"'$(git describe --tags --always --abbrev=10 | sed 's/-/+/' | sed 's/^v//' | sed 's/-g/-/')'\"}' > src/version.json"
- yarn run build - pnpm run build
- sed -i 's/http\:\\/\\/localhost\\:3456\\/api\\/v1/\\/api\\/v1/g' dist/index.html # Override the default api url used for developing - sed -i 's/http\:\\/\\/localhost\\:3456\\/api\\/v1/\\/api\\/v1/g' dist/index.html # Override the default api url used for developing
# depends_on: # depends_on:
# - restore-cache # - restore-cache
@ -647,6 +659,6 @@ steps:
from_secret: crowdin_key from_secret: crowdin_key
--- ---
kind: signature kind: signature
hmac: 997e1badebe484ac29557c4af356e63db4d3d57f3d32e92d482f117f8cec64da hmac: 9e9585222c466c67b426df40c76670f1a539c363a52075ff34e7f4518e67da2d
... ...

4
.gitignore vendored
View File

@ -8,10 +8,14 @@ node_modules
.env.*.local .env.*.local
# Log files # Log files
logs
*.log
npm-debug.log* npm-debug.log*
yarn-debug.log* yarn-debug.log*
yarn-error.log* yarn-error.log*
stats.html stats.html
pnpm-debug.log*
lerna-debug.log*
# Editor directories and files # Editor directories and files
.idea .idea

2
.npmrc Normal file
View File

@ -0,0 +1,2 @@
auto-install-peers=true
fetch-timeout=100000

View File

@ -1,5 +1,5 @@
{ {
"eslint.packageManager": "yarn", "eslint.packageManager": "pnpm",
"editor.formatOnSave": false, "editor.formatOnSave": false,
"editor.codeActionsOnSave": { "editor.codeActionsOnSave": {
"source.fixAll": true "source.fixAll": true

View File

@ -1,28 +1,41 @@
# Stage 1: Build application # Stage 1: Build application
FROM node:18 AS compile-image FROM node:18-alpine AS compile-image
WORKDIR /build WORKDIR /build
ARG USE_RELEASE=false ARG USE_RELEASE=false
ARG RELEASE_VERSION=main ARG RELEASE_VERSION=main
ENV YARN_CACHE_FOLDER .cache/yarn/
COPY . ./
RUN \ RUN \
if [ $USE_RELEASE = true ]; then \ if [ $USE_RELEASE = true ]; then \
rm -rf dist/ && \
wget https://dl.vikunja.io/frontend/vikunja-frontend-$RELEASE_VERSION.zip -O frontend-release.zip && \ wget https://dl.vikunja.io/frontend/vikunja-frontend-$RELEASE_VERSION.zip -O frontend-release.zip && \
unzip frontend-release.zip -d dist/ && \ unzip frontend-release.zip -d dist/ && \
exit 0; \ exit 0; \
fi && \ fi
ENV PNPM_CACHE_FOLDER .cache/pnpm/
Review

This is the only place where there is now a final /

This is the only place where there is now a final `/`
# pnpm fetch does require only lockfile
konrad marked this conversation as resolved Outdated

But we'll still need to copy all frontend files anyway?

But we'll still need to copy all frontend files anyway?

Yes. This just makes that step cachable.

Copying everything over happens in line 28.

Yes. This just makes that step cachable. Copying everything over happens in line 28.
COPY pnpm-lock.yaml ./
RUN \
# https://pnpm.io/installation#using-corepack
corepack enable && \
corepack prepare pnpm@7.9.3 --activate && \
# Build the frontend # Build the frontend
yarn install --frozen-lockfile --network-timeout 100000 && \ pnpm fetch
echo '{"VERSION": "'$(git describe --tags --always --abbrev=10 | sed 's/-/+/' | sed 's/^v//' | sed 's/-g/-/')'"}' > src/version.json && \
yarn run build ADD . ./
RUN apk add --no-cache git
RUN \
pnpm install --offline && \
echo '{"VERSION": "'$(git describe --tags --always --abbrev=10 | sed 's/-/+/' | sed 's/^v//' | sed 's/-g/-/')'"}' > src/version.json && \
pnpm run build
# Stage 2: copy # Stage 2: copy
FROM nginx FROM nginx:alpine
COPY nginx.conf /etc/nginx/nginx.conf COPY nginx.conf /etc/nginx/nginx.conf
COPY run.sh /run.sh COPY run.sh /run.sh
@ -36,4 +49,10 @@ ENV PGID 1000
LABEL maintainer="maintainers@vikunja.io" LABEL maintainer="maintainers@vikunja.io"
RUN apk add --no-cache \
# for sh file
bash \
# installs usermod and groupmod
shadow
CMD "/run.sh" CMD "/run.sh"

View File

@ -22,25 +22,25 @@ There is a [docker image available](https://hub.docker.com/r/vikunja/api) with s
## Project setup ## Project setup
```shell ```shell
yarn install pnpm install
``` ```
### Compiles and hot-reloads for development ### Compiles and hot-reloads for development
```shell ```shell
yarn run serve pnpm run serve
``` ```
### Compiles and minifies for production ### Compiles and minifies for production
```shell ```shell
yarn run build pnpm run build
``` ```
### Lints and fixes files ### Lints and fixes files
```shell ```shell
yarn run lint pnpm run lint
``` ```
## Sponsors ## Sponsors

View File

@ -36,7 +36,7 @@ to get a shell inside the cypress container.
In that shell you can then execute the tests with In that shell you can then execute the tests with
```shell ```shell
yarn test:frontend pnpm run test:frontend
``` ```
### Using The Cypress Dashboard ### Using The Cypress Dashboard
@ -44,5 +44,5 @@ yarn test:frontend
To open the Cypress Dashboard and run tests from there, run To open the Cypress Dashboard and run tests from there, run
```shell ```shell
yarn cypress:open pnpm run cypress:open
``` ```

View File

@ -1,5 +1,5 @@
[build] [build]
command = "yarn build" command = "pnpm run build"
publish = "dist-preview" publish = "dist-preview"
[[redirects]] [[redirects]]

View File

@ -35,6 +35,7 @@
"blurhash": "2.0.0", "blurhash": "2.0.0",
"bulma-css-variables": "0.9.33", "bulma-css-variables": "0.9.33",
"camel-case": "4.1.2", "camel-case": "4.1.2",
"codemirror": "5.65.7",
"date-fns": "2.29.3", "date-fns": "2.29.3",
"dompurify": "2.4.0", "dompurify": "2.4.0",
"easymde": "2.18.0", "easymde": "2.18.0",
@ -49,6 +50,7 @@
"pinia": "2.0.22", "pinia": "2.0.22",
"register-service-worker": "1.7.2", "register-service-worker": "1.7.2",
"snake-case": "3.0.4", "snake-case": "3.0.4",
"sortablejs": "1.15.0",
"ufo": "0.8.5", "ufo": "0.8.5",
"v-tooltip": "4.0.0-beta.17", "v-tooltip": "4.0.0-beta.17",
"vue": "3.2.39", "vue": "3.2.39",
@ -105,5 +107,5 @@
} }
}, },
"license": "AGPL-3.0-or-later", "license": "AGPL-3.0-or-later",
"packageManager": "yarn@1.22.19" "packageManager": "pnpm@7.9.3"
} }

13259
pnpm-lock.yaml Normal file

File diff suppressed because it is too large Load Diff

13501
yarn.lock

File diff suppressed because it is too large Load Diff