create-dmg 是一个用于构建精美 dmg 镜像的 shell 脚本。目前大多数开发者，包括 Apple 官方，都在使用 dmg 镜像来分发 Mac App，本文将使用 create-dmg 来制作一个 app 分发镜像。
准备
安装 create-dmg：
创建 dmg 文件
创建时你需要准备好你的 app 和一张引导拖拽的背景图（文中提供了一张我准备好的），文件目录：
NewEmptyFolder
- MacApp.app
- backgroung.svg
背景图
<svg width="100%" height="100%" viewBox="0 0 660 400" version="1.1" xmlns="
http://www.w3.org/2000/svg" xmlns:xlink="
http://www.w3.org/1999/xlink" xml:space="preserve" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
<filter id="shadow_filter">
<feDropShadow dx="4" dy="4" stdDeviation="2" flood-color="gray" flood-opacity="0.2" />
</filter>
<path d="M592.5,127.251l0,106.5c0,29.389 -23.861,53.25 -53.25,53.25l-417.5,0c-29.389,0 -53.25,-23.861 -53.25,-53.25l0,-106.5c0,-29.389 23.861,-53.25 53.25,-53.25l417.5,0c29.389,0 53.25,23.861 53.25,53.25Z" style="fill:#fff;" filter="url(#shadow_filter)"/>
<path d="M344.971,177.475l-23.993,-22.494c-1.316,-1.234 -3.237,-1.234 -4.554,0l-0.396,0.372c-1.684,1.579 -1.684,4.471 0,6.05l17.145,16.073c1.684,1.579 1.684,4.471 0,6.05l-17.143,16.073c-1.685,1.579 -1.685,4.471 0,6.05l0.395,0.372c1.316,1.234 3.237,1.234 4.554,0l23.993,-22.494c1.685,-1.579 1.685,-4.471 0,-6.05l-0.001,-0.002Z" style="fill:#6c6c6c;"/>
</svg>
<button id="download-svg-btn" style="padding: 10px 20px; background-color: #0066cc; color: white; border: none; border-radius: 5px; cursor: pointer; font-size: 14px;">下載 SVG</button>
進入資料夾所在的目錄開啟 Terminal。然後執行以下命令：
create-dmg \
--volname "Application Installer" \
--background "background.svg" \
--window-pos 400 200 \
--window-size 660 400 \
--icon-size 100 \
--icon "Application.app" 160 160 \
--hide-extension "Application.app" \
--app-drop-link 500 160 \
"Application.dmg" \
"Application.app/"
雙擊開啟 Application.dmg
如果你有準備icns圖示，也可以設定映象的圖示：
--volicon "AppIcon.icns" \
<script>
document.getElementById('download-svg-btn').addEventListener('click', function() {
const svgElement = document.getElementById('dmg-svg');
const svgString = new XMLSerializer().serializeToString(svgElement);
const blob = new Blob([svgString], { type: 'image/svg+xml' });
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.download = 'background.svg';
document.body.appendChild(link);
link.click();
document.body.removeChild(link);
URL.revokeObjectURL(url);
});
</script>
.png){kind=icon}
Select Language