如何在Docker容器中部署TailwindCSS？权限拒绝问题求助

问题详情 #

执行tailwindcss命令时触发权限拒绝错误，报错信息如下：

Traceback (most recent call last):
  File "/usr/local/bin/tailwindcss", line 8, in <module>
    sys.exit(main())
  File "/usr/local/lib/python3.10/site-packages/pytailwindcss/__main__.py", line 9, in main
    completed_process = pytailwindcss.run(
  File "/usr/local/lib/python3.10/site-packages/pytailwindcss/__init__.py", line 45, in run
    install(version, bin_path)
  File "/usr/local/lib/python3.10/site-packages/pytailwindcss/__init__.py", line 69, in install
    return install_binary(version, ensure_is_pathlib_path(bin_path))
  File "/usr/local/lib/python3.10/site-packages/pytailwindcss/installation.py", line 25, in install_binary
    os.makedirs(bin_path.parent, exist_ok=True)
  File "/usr/local/lib/python3.10/os.py", line 225, in makedirs
    mkdir(name, mode)
PermissionError: [Errno 13] Permission denied: '/usr/local/lib/python3.10/site-packages/pytailwindcss/bin

当前使用的Dockerfile配置：

FROM mcr.microsoft.com/vscode/devcontainers/python:3.10-bullseye

ENV PYTHONUNBUFFERED=1

WORKDIR /app

ARG FLASK_APP=project.app
ENV FLASK_APP=${FLASK_APP}

ARG FLASK_RUN_PORT=5001
ENV FLASK_RUN_PORT=${FLASK_RUN_PORT}

CMD flask run --host=0.0.0.0 # --port=${FLASK_RUN_PORT} --app=${FLASK_APP}

COPY requirements.txt /tmp/pip-tmp/
RUN pip --disable-pip-version-check install -r /tmp/pip-tmp/requirements.txt && \
    rm -rf /tmp/pip-tmp

COPY . .

RUN pip --disable-pip-version-check install -v -e .

ARG CI_COMMIT_SHA
ENV CI_COMMIT_SHA=${CI_COMMIT_SHA}

RUN echo "BUILD_DATE=$(date -u +'%Y-%m-%dT%H:%M:%SZ')" >> /app/.env

ARG USERNAME=vscode
RUN test ! -z "${USERNAME}" && mkdir -p /home/${USERNAME}/.vscode-server/extensions && \
    chown -R $USERNAME /home/${USERNAME}/.vscode-server

requirements.txt内容：

importlib-metadata
flask
python-dotenv
flask-login
passlib
flask-mongoengine
python-dateutil
pytailwindcss
pre-commit
sentry-sdk[flask]
sentry-sdk[pymongo]

解决方案 #

方案1：指定pytailwindcss二进制文件安装到用户可写目录 #

pytailwindcss默认会把CLI二进制文件安装到系统级目录（普通用户无写入权限），可以通过环境变量PYTAILWINDCSS_BIN_PATH指定到用户私有目录。修改Dockerfile添加以下配置：

ARG USERNAME=vscode
# 创建用户可写的二进制目录并设置权限
RUN mkdir -p /home/${USERNAME}/.local/bin && \
    chown -R ${USERNAME}:${USERNAME} /home/${USERNAME}/.local/bin
# 告诉pytailwindcss将二进制文件安装到该目录
ENV PYTAILWINDCSS_BIN_PATH=/home/${USERNAME}/.local/bin/tailwindcss
# 将该目录加入系统PATH，方便直接调用命令
ENV PATH="/home/${USERNAME}/.local/bin:${PATH}"

# 切换到vscode用户执行后续操作
USER ${USERNAME}

也可以在运行tailwindcss命令前临时指定环境变量：

PYTAILWINDCSS_BIN_PATH=/home/vscode/.local/bin/tailwindcss tailwindcss build -i input.css -o output.css

方案2：修改pytailwindcss安装目录的权限 #

在Dockerfile中安装完依赖后，修改pytailwindcss目录的权限，让vscode用户拥有写入权限：

COPY requirements.txt /tmp/pip-tmp/
RUN pip --disable-pip-version-check install -r /tmp/pip-tmp/requirements.txt && \
    rm -rf /tmp/pip-tmp && \
    # 修改pytailwindcss目录权限
    chown -R vscode:vscode /usr/local/lib/python3.10/site-packages/pytailwindcss

方案3：直接使用官方TailwindCSS CLI（替代pytailwindcss） #

去掉requirements.txt中的pytailwindcss，改用官方CLI二进制文件。在Dockerfile中添加下载安装步骤：

ARG TAILWIND_VERSION=v3.3.3
ARG USERNAME=vscode

# 下载并安装官方TailwindCSS CLI
RUN curl -sLO https://github.com/tailwindlabs/tailwindcss/releases/download/${TAILWIND_VERSION}/tailwindcss-linux-x64 && \
    chmod +x tailwindcss-linux-x64 && \
    mv tailwindcss-linux-x64 /usr/local/bin/tailwindcss && \
    chown ${USERNAME}:${USERNAME} /usr/local/bin/tailwindcss

内容的提问来源于stack exchange，提问作者Viltzu