使用 Dev Container 寫 LaTeX 教學

步驟一:建立 Dockerfile

用VSCode開啟專案資料夾並進入,下載並開啟Docker Desktop (容器環境)。

檔案名稱不能有中文!!!!!!!!!!!

新增 .devcontainer/Dockerfile

FROM texlive/texlive:latest

# 安裝常用工具
RUN apt-get update && apt-get install -y \
    git \
    latexmk \
    && rm -rf /var/lib/apt/lists/*Code language: PHP (php)

步驟二:建立 devcontainer.json

新增 .devcontainer/devcontainer.json

{
  "name": "LaTeX",
  "build": {
    "dockerfile": "Dockerfile"
  },
  "customizations": {
    "vscode": {
      "extensions": [
        "James-Yu.latex-workshop"
      ]
    }
  },
  "workspaceMount": "source=${localWorkspaceFolder},target=/workspace,type=bind",
  "workspaceFolder": "/workspace"
}
Code language: JSON / JSON with Comments (json)

步驟三:建立 VSCode settings.json

新增 .vscode/settings.json

{
  "latex-workshop.latex.recipes": [
    {
      "name": "xelatex × 2",
      "tools": [
        "xelatex",
        "xelatex"
      ]
    },
    {
      "name": "latexmk (xelatex)",
      "tools": [
        "latexmk-xelatex"
      ]
    }
  ],
  "latex-workshop.latex.tools": [
    {
      "name": "xelatex",
      "command": "xelatex",
      "args": [
        "-synctex=1",
        "-interaction=nonstopmode",
        "-file-line-error",
        "%DOC%"
      ]
    },
    {
      "name": "latexmk-xelatex",
      "command": "latexmk",
      "args": [
        "-xelatex",
        "-synctex=1",
        "-interaction=nonstopmode",
        "%DOC%"
      ]
    }
  ],
  "latex-workshop.view.pdf.viewer": "tab",
  "latex-workshop.latex.autoBuild.run": "onSave",
  "latex-workshop.formatting.latex": "latexindent",
  "[latex]": {
    "editor.defaultFormatter": "James-Yu.latex-workshop",
    "editor.formatOnSave": true
  }
}Code language: JSON / JSON with Comments (json)

步驟四:下載字體

下載並安裝後,將.ttf檔複製到專案資料夾中

https://github.com/Chen11111112/Xelatex-.git

步驟五:撰寫 main.tex(中文範例)

\documentclass[12pt, a4paper]{article}
\usepackage{fontspec}
\usepackage{xeCJK}


\setCJKmainfont{AR PL KaitiM Big5} 

\begin{document}
Hello World,這是我的第一個TEX!!
\end{document}Code language: JavaScript (javascript)

容器內預設有 Noto CJK 字型,直接使用即可。

步驟六:啟動 Dev Container

  1. 用 VSCode 開啟專案資料夾
  2. 按左下角 >< 藍色按鈕,選擇 Reopen in Container
  3. 第一次會 build Docker image,約等 3–5 分鐘
  4. 完成後環境自動就緒

步驟七:編譯

開啟 main.tex,有三種方式觸發編譯:

方式操作
存檔自動編譯Ctrl + S
手動編譯點右上角 ▶ 按鈕
CLI 編譯在 VSCode 終端機輸入 xelatex main.tex

PDF 會在側欄自動開啟預覽。


部分資料來源: https://lucashsu95.github.io/LucasHsu.dev/devops/latex-devcontainer-guide


模板

會來跟著這篇文章操作的因該都是商智中心的w,既然要出題,當然就是以進雄大大的模板為標準:

\documentclass[12pt, a4paper]{article}
\usepackage{fontspec}
\usepackage{xeCJK}
\usepackage{amsmath}
\usepackage{amssymb}
\usepackage{fancyvrb}
\usepackage[left=2cm, right=2cm, top=2.5cm, bottom=2.5cm]{geometry}

\setCJKmainfont{AR PL KaitiM Big5}

\newcommand{\problemheader}[2]{
    \begin{center}
        {\Large #1} \\
        {\Huge \textbf{#2}}
    \end{center}
    \vspace{1em}
}

\newcommand{\problemsection}[1]{
    \vspace{1.5em}
    {\Large \textbf{#1}}
    \vspace{0.5em}
}

\DefineVerbatimEnvironment{SampleBox}{Verbatim}{
    frame=single,
    framesep=3mm,
    fontsize=\small,
    baselinestretch=1.2
}

\date{}

\begin{document}

\problemheader{Problem A}{Hello World}

\problemsection{Problem Description}

歡迎來到程式設計的世界!這是一題熱身題。

請寫一個程式,在畫面中輸出指定的字串:\texttt{Hello World}。

\problemsection{Input Format}

本題沒有任何輸入資料。

\problemsection{Output Format}
請輸出一行字串:\texttt{Hello World}。
\newline
請注意大小寫必須完全相符,且行末需換行。

\vspace{1.5em}

% --- Sample 1 ---
\noindent
\begin{minipage}[t]{0.48\textwidth}
    \subsection*{Sample Input 1}
\begin{SampleBox}

\end{SampleBox}
\end{minipage}
\hfill
\begin{minipage}[t]{0.48\textwidth}
    \subsection*{Sample Output 1}
\begin{SampleBox}
Hello World
\end{SampleBox}
\end{minipage}

\end{document}Code language: PHP (php)

Leave a Reply

Your email address will not be published. Required fields are marked *