Skip to content

Commit bdd3e82

Browse files
authored
feat: devcontainer (#1283)
1 parent c40429a commit bdd3e82

File tree

4 files changed

+158
-12
lines changed

4 files changed

+158
-12
lines changed

.devcontainer/Dockerfile

+14
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
# [Choice] Node.js version (use -bullseye variants on local arm64/Apple Silicon): 18, 16, 14, 18-bullseye, 16-bullseye, 14-bullseye, 18-buster, 16-buster, 14-buster
2+
ARG VARIANT=16-bullseye
3+
FROM mcr.microsoft.com/vscode/devcontainers/javascript-node:0-${VARIANT}
4+
5+
# [Optional] Uncomment this section to install additional OS packages.
6+
# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
7+
# && apt-get -y install --no-install-recommends <your-package-list-here>
8+
9+
# [Optional] Uncomment if you want to install an additional version of node using nvm
10+
# ARG EXTRA_NODE_VERSION=10
11+
# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"
12+
13+
# [Optional] Uncomment if you want to install more global node modules
14+
# RUN su node -c "npm install -g <your-package-list-here>"

.devcontainer/base.Dockerfile

+55
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,55 @@
1+
# [Choice] Node.js version (use -bullseye variants on local arm64/Apple Silicon): 18-bullseye, 16-bullseye, 14-bullseye, 18-buster, 16-buster, 14-buster
2+
ARG VARIANT=16-bullseye
3+
FROM node:${VARIANT}
4+
5+
# [Option] Install zsh
6+
ARG INSTALL_ZSH="true"
7+
# [Option] Upgrade OS packages to their latest versions
8+
ARG UPGRADE_PACKAGES="true"
9+
10+
# Install needed packages, yarn, nvm and setup non-root user. Use a separate RUN statement to add your own dependencies.
11+
ARG USERNAME=node
12+
ARG USER_UID=1000
13+
ARG USER_GID=$USER_UID
14+
ARG NPM_GLOBAL=/usr/local/share/npm-global
15+
ENV NVM_DIR=/usr/local/share/nvm
16+
ENV NVM_SYMLINK_CURRENT=true \
17+
PATH=${NPM_GLOBAL}/bin:${NVM_DIR}/current/bin:${PATH}
18+
COPY library-scripts/*.sh library-scripts/*.env /tmp/library-scripts/
19+
RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
20+
# Remove imagemagick due to https://security-tracker.debian.org/tracker/CVE-2019-10131
21+
&& apt-get purge -y imagemagick imagemagick-6-common \
22+
# Install common packages, non-root user, update yarn and install nvm
23+
&& bash /tmp/library-scripts/common-debian.sh "${INSTALL_ZSH}" "${USERNAME}" "${USER_UID}" "${USER_GID}" "${UPGRADE_PACKAGES}" "true" "true" \
24+
# Install yarn, nvm
25+
&& rm -rf /opt/yarn-* /usr/local/bin/yarn /usr/local/bin/yarnpkg \
26+
&& bash /tmp/library-scripts/node-debian.sh "${NVM_DIR}" "none" "${USERNAME}" \
27+
# Configure global npm install location, use group to adapt to UID/GID changes
28+
&& if ! cat /etc/group | grep -e "^npm:" > /dev/null 2>&1; then groupadd -r npm; fi \
29+
&& usermod -a -G npm ${USERNAME} \
30+
&& umask 0002 \
31+
&& mkdir -p ${NPM_GLOBAL} \
32+
&& touch /usr/local/etc/npmrc \
33+
&& chown ${USERNAME}:npm ${NPM_GLOBAL} /usr/local/etc/npmrc \
34+
&& chmod g+s ${NPM_GLOBAL} \
35+
&& npm config -g set prefix ${NPM_GLOBAL} \
36+
&& sudo -u ${USERNAME} npm config -g set prefix ${NPM_GLOBAL} \
37+
# Install eslint
38+
&& su ${USERNAME} -c "umask 0002 && npm install -g eslint" \
39+
&& npm cache clean --force > /dev/null 2>&1 \
40+
# Install python-is-python3 on bullseye to prevent node-gyp regressions
41+
&& . /etc/os-release \
42+
&& if [ "${VERSION_CODENAME}" = "bullseye" ]; then apt-get -y install --no-install-recommends python-is-python3; fi \
43+
# Clean up
44+
&& apt-get autoremove -y && apt-get clean -y && rm -rf /var/lib/apt/lists/* /root/.gnupg /tmp/library-scripts
45+
46+
# [Optional] Uncomment this section to install additional OS packages.
47+
# RUN apt-get update && export DEBIAN_FRONTEND=noninteractive \
48+
# && apt-get -y install --no-install-recommends <your-package-list-here>
49+
50+
# [Optional] Uncomment if you want to install an additional version of node using nvm
51+
# ARG EXTRA_NODE_VERSION=10
52+
# RUN su node -c "source /usr/local/share/nvm/nvm.sh && nvm install ${EXTRA_NODE_VERSION}"
53+
54+
# [Optional] Uncomment if you want to install more global node modules
55+
# RUN su node -c "npm install -g <your-package-list-here>""

.devcontainer/devcontainer.json

+51
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,51 @@
1+
// For format details, see https://aka.ms/devcontainer.json. For config options, see the README at:
2+
// https://github.com/microsoft/vscode-dev-containers/tree/v0.241.1/containers/javascript-node
3+
{
4+
"name": "Node.js",
5+
"build": {
6+
"dockerfile": "Dockerfile",
7+
// Update 'VARIANT' to pick a Node version: 18, 16, 14.
8+
// Append -bullseye or -buster to pin to an OS version.
9+
// Use -bullseye variants on local arm64/Apple Silicon.
10+
"args": { "VARIANT": "16-bullseye" }
11+
},
12+
13+
// Configure tool-specific properties.
14+
"customizations": {
15+
// Configure properties specific to VS Code.
16+
"vscode": {
17+
// Add the IDs of extensions you want installed when the container is created.
18+
"extensions": [
19+
"eamodio.gitlens",
20+
"yzhang.markdown-all-in-one",
21+
"philipbe.theme-gray-matter",
22+
"bierner.markdown-preview-github-styles",
23+
"xabikos.JavaScriptSnippets",
24+
"dbaeumer.vscode-eslint",
25+
"drKnoxy.eslint-disable-snippets",
26+
"esbenp.prettier-vscode",
27+
"stylelint.vscode-stylelint",
28+
"jock.svg",
29+
"gencer.html-slim-scss-css-class-completion",
30+
"syler.sass-indented",
31+
"christian-kohler.path-intellisense"
32+
]
33+
}
34+
},
35+
36+
// Use 'forwardPorts' to make a list of ports inside the container available locally.
37+
"forwardPorts": [3000],
38+
39+
// Use 'postCreateCommand' to run commands after the container is created.
40+
"postCreateCommand": "yarn && yarn prepare-data",
41+
"postStartCommand": "echo 'Please read the README document at https://github.com/apache/apisix-website before using, developing, or encountering problems.'",
42+
43+
// Comment out to connect as root instead. More info: https://aka.ms/vscode-remote/containers/non-root.
44+
"remoteUser": "node",
45+
"features": {
46+
"git": "os-provided"
47+
},
48+
"hostRequirements": {
49+
"memory": "2gb"
50+
}
51+
}

README.md

+38-12
Original file line numberDiff line numberDiff line change
@@ -13,15 +13,13 @@ A cloud-native microservices API Gateway
1313

1414
<br>
1515

16-
## Usage
16+
## Getting Started
1717

1818
> If you want to write a blog or fix some blog-related issues, please read [Apache APISIX Blog Contributing Guide](http://apisix.apache.org/docs/general/blog) first.
1919
2020
### Pre-requisites
2121

22-
First, you need to install `Node.js`, `Yarn`, `Git`.
23-
24-
Since the installation method may change, we recommend that you check the installation method on the corresponding official website. If you encounter any problems, please feel free to create an issue.
22+
First, you need to install **Git**.
2523

2624
Then you should fork this repo, and clone your fork:
2725

@@ -36,21 +34,41 @@ git remote add upstream https://github.com/apache/apisix-website.git
3634
cd apisix-website
3735
```
3836

39-
### Basic
37+
### Getting started in a Dev Container
38+
39+
If you are using **VS Code**, **Docker**, and **Remote - Containers** plugin, you can use this to get started quickly.
40+
41+
> No, but want to try this way? Please read [Developing inside a Container#Installation](https://code.visualstudio.com/docs/remote/containers#_installation).
42+
43+
Then, start **VS Code**, run the `Remote-Containers: Open Folder in Container...` command.
44+
45+
> **Tip:** For details on how to do this, see the documentation [Developing inside a Container#Quick Start](https://code.visualstudio.com/docs/remote/containers#_quick-start-open-an-existing-folder-in-a-container).
46+
47+
After the initialization, you can skip the preparation part of the commands below and read [the rest](#previewing-documents-developing) directly.
48+
49+
### Getting started in the conventional way
50+
51+
First, you need to install **Node.js**, **Yarn**.
52+
53+
> **Tip:** Since the installation method may change, we recommend that you check the installation method on the corresponding official website. If you encounter any problems, please feel free to create an issue.
54+
55+
Then you can read [the commands](#commands) below.
56+
57+
## Commands
4058

4159
When you find that some commands do not run, or cannot be found, look at the package.json file.
4260

43-
This may be because the project is being updated quickly, but there is no time to make updates to the relevant documentation.
61+
This may be because the project is being updated quickly, but the corresponding developer did not find the time to update the corresponding documentation.
4462

45-
#### Preparation
63+
### Preparation
4664

4765
Except for the following commands that you need to run after downloading the project for the first time, you can **try running them again** when you encounter any problems.
4866

4967
```sh
5068
# 1. Install deps
5169
yarn
5270

53-
# 2. Prepare necessory data
71+
# 2. Prepare necessary data
5472
yarn prepare-data
5573

5674
# Tip.
@@ -61,7 +79,15 @@ yarn generate-repos-info # Generate repository information for each project
6179
yarn generate-picked-posts # Generate frontmatter information for featured blogs
6280
```
6381

64-
#### Preview documentation, Development
82+
> If you get a 403 error `Rate Limit Exceeded` from GitHub, that means you have hit the GitHub API rate limit. the project needs your [personal access token](https://github.com/settings/tokens) to unlimit it.
83+
>
84+
> If you don't already have one, [create one](https://github.com/settings/tokens/new), and run below command in your terminal (no scope to your personal data is needed)
85+
>
86+
> ```bash
87+
> export GITHUB_TOKEN=${your token}
88+
> ```
89+
90+
### Previewing documents, Developing
6591
6692
When you modify a document, blog, or page code, the preview in development mode is the fastest.
6793
@@ -86,7 +112,7 @@ yarn start:blog:zh
86112
yarn start:website
87113
```
88114
89-
#### Build locally
115+
### Building
90116

91117
When you want to build or preview a site that looks the same as it does online, run the following commands.
92118

@@ -111,13 +137,13 @@ preview=true yarn build:website && yarn serve:website
111137

112138
Next, you can modify the documentation or code, commit it and push it to GitHub when you're done. If you're not familiar with this, you can read [GitHub flow](https://docs.github.com/en/get-started/quickstart/github-flow) first.
113139

114-
### Advance
140+
## Advance Guide
115141

116142
If you only want to modify the `*.md` files, the above guide may be sufficient.
117143

118144
But if you need to develop, please read the guide below.
119145

120-
#### Project Structure
146+
### Project Structure
121147

122148
Omitted some documents that may not be important.
123149

0 commit comments

Comments
 (0)