算出一件商品真正的成本、邊際貢獻,以及打折之後還剩多少。
給電商與手作品牌用的成本試算工具。純前端、沒有後端、不用註冊, 資料只留在你自己的瀏覽器裡。
這個工具是從一份用了很多年的成本試算表長出來的。那份試算表有三個問題, 共通點是錯誤的方向都是讓毛利看起來比較好,所以沒有人會發現:
| 問題 | 後果 |
|---|---|
| 耗損率沒有計入成本 | 成本系統性低估 |
稅率被寫死成一個 0.048 的常數 |
沒有人記得那是「5% 營業稅 ÷ 1.05」,改成未稅報價時無從改起 |
| 有物料還沒問到價格時,剩下的照樣加總 | 加出一個偏低的成本,看起來毛利很漂亮 |
所以這個工具的設計原則只有一句話:
算不出來就說算不出來,不要給一個看起來能用的假數字。
1. 算不出來一律回 null,不用 0 代替
- 任一物料缺單價 → 整張 BOM 成本為
null,不做部分加總 - 成本未知 → 邊際貢獻為
null - 促銷試算成本未知 → 「這樣打折還有賺嗎」顯示不知道,不顯示「有賺」
- 費率吃掉全部售價 → 折扣下限顯示無解,不是一個很大的數字
畫面上的「-」代表未知,不代表 0。
2. 耗損率是除進去,不是乘上去
耗損 10% 代表投入只有 90% 變成成品,所以成本要放大成 1 ÷ 0.9(約 1.111 倍),
不是 × 1.1。這兩個數字差 1%,量大時就是幾萬塊。
3. 營業稅存稅率本身
存的是 0.05 加上一個「售價是否含稅」的布林值。
含稅時售價中的實質稅負佔比 0.05 ÷ 1.05 = 4.76% 由程式推導。
0.048 這種數字不會出現在資料裡:一旦寫死,「含不含稅」這個前提就消失了。
4. 分類名稱你自己取,程式只認計價行為
計價行為只有三種:
| 行為 | 意思 | 例子 |
|---|---|---|
MATERIAL |
依用量計價 | 原料、包材 |
PROCESS |
依次數計價 | 灌模、印刷、代工 |
AMORTIZED |
一次性攤提 | 模具、開版費 |
分類要叫「配方油脂」、「進貨成本」還是「原物料」隨你,程式一律不看名稱。
同一套程式因此可以給不同產業用,原始碼裡沒有任何一行 if (產業 === "...")。
npm install
npm run dev其他指令:
npm run build # 產生 dist/,靜態檔案,丟哪都能跑
npm test # 計算核心 36 條測試 + 禁用字串掃描
npm run lint # 型別檢查在你的瀏覽器裡,只有那裡。 沒有伺服器,我們看不到,也沒有任何地方有備份。
所以「下載存檔」不是附加功能,它就是存檔機制。
清除瀏覽器資料、換電腦、換瀏覽器,localStorage 就沒了。
畫面上只要有還沒下載的變更就會一直提醒你,那不是囉唆,是真的會不見。
下載下來的 JSON 就是完整的檔案,「讀取存檔」可以原樣讀回來。
「匯入試算表」可以讀 .xlsx(舊版 .xls 請先另存新檔)。
它靠表頭關鍵字認欄位,所以你的表不需要長得跟這個工具一樣:
| 想匯入 | 表裡要有的欄位(關鍵字) |
|---|---|
| 物料 | 名稱/品名 + 單價,可再加 單位、分類、耗損、幣別、匯率、備註 |
| 產品 | 產品/品名 + 售價,可再加 料號、產出數量 |
| 用料(BOM) | 產品 + 物料 + 用量 |
| 費率 | 名稱 + 費率/運費,可再加 使用佔比 |
認不出來的東西不會硬猜:整張表或個別列會被跳過,並在畫面上列出原因。 會被跳過的常見情況:
- 看不懂的單價 → 該項物料匯入成「沒有單價」,不會變成 0
- 判斷不出屬於哪一種的費率 → 不匯入,請自己到費率設定頁新增
- 「營業稅」那一列 → 不匯入。稅要在設定頁填稅率本身並勾選售價是否含稅(見上面第 3 條)
新建立的分類一律預設為「依用量計價」,並提醒你去確認:程式不從分類名稱猜行為。
解壓用 fflate,XML 用瀏覽器內建的 DOMParser,
沒有引入 SheetJS:.xlsx 本來就是一包 zip 裡的 XML,為了讀幾張表扛一個大型相依並不划算。
靜態站,npm run build 出來的 dist/ 丟到任何靜態主機都能跑。
Vercel 會自動認出 Vite 專案,不需要額外設定,也不需要任何環境變數。
npm test 裡有兩條掃描測試,掃描範圍是整個 repo(不含 node_modules 與建置產物):
forbidden-strings.test.ts擋下不該進入這個 repo 的字串: 內部專案代號、客戶名稱、平台名稱、內部工單編號,以及破折號(要停頓就用全形冒號或逗號)。punctuation.test.ts擋下中文句子裡的半形逗號。 它只掃非測試檔:測試裡會故意放半形逗號來驗 CSV 跳脫,那是測試資料不是行文。
另外 contrast.test.ts 會實際計算色票的對比度,
確保每一種文字顏色在每一種底色上都達到 WCAG AA 的 4.5:1。
FSL-1.1-MIT(Functional Source License,兩年後轉 MIT)。
原始碼公開,但這不是 open source,正確的說法是 source available。 程式碼可以自由閱讀與修改,只有一項限制:不能把這個軟體本身當商品賣。
可以:自己用、公司內部用、修改它、發布你的修改版、拿去上收費課程與企業內訓、 用在你提供給客戶的專業服務裡。
不可以:把它當產品販售(包含改名換皮的版本)、架成 SaaS 或線上服務對外收費、 做出功能實質相同的競品、移除原始碼裡的著作權標示。
判斷原則是:教學可以收費,軟體本身不可以。 另外每個版本在釋出滿兩年後會自動轉為 MIT 授權,屆時所有限制解除。 需要落在禁止範圍內的使用方式,來信談商用授權。