5 Commits

Author SHA1 Message Date
6cff4247a8 typo
Some checks failed
continuous-integration/drone/push Build is failing
continuous-integration/drone/tag Build is passing
2022-12-05 01:26:12 +08:00
90ff1382a8 add drone pipeline
Some checks reported errors
continuous-integration/drone/push Build encountered an error
2022-12-05 01:24:56 +08:00
1450357b91 add drone pipeline
All checks were successful
continuous-integration/drone/push Build is passing
2022-12-05 01:01:06 +08:00
7a31c36c10 Replace react with preact
reduce js file bundle to 20%
2022-12-04 20:08:08 +08:00
5271c12525 Replace webpack with only esbuild
reduce node_modules size to only 18M
2022-12-04 19:34:13 +08:00
12 changed files with 91 additions and 133 deletions

View File

@@ -2,9 +2,6 @@ kind: pipeline
type: docker
name: default
clone:
depth: 1
steps:
- name: frontend-web
image: node:19
@@ -13,22 +10,9 @@ steps:
- npm install
- npm run build
- name: backend
image: golang:1.19
commands:
- go build -v .
environment:
CGO_ENABLED: 0
GOPROXY: goproxy.cn
- name: upload
image: plugins/s3-sync
- name: release
image: plugins/gitea-release
settings:
bucket: msw-artifacts-public
region: ap-southeast-1
access_key:
from_secret: access_key
secret_key:
from_secret: secret_key
source: msw-open-music
target: /msw-open-music/${DRONE_COMMIT}/
api_key: da966507c259aa32ccc2d434e930af4a580de785
base_url: https://yongyuancv.cn/git/
files: dist/*

View File

@@ -4,7 +4,7 @@ web:
cd web && npm run build
linux:
CGO_ENABLED=0 go build -v -ldflags '-extldflags=-static'
go build -v -ldflags '-linkmode=external -extldflags=-static' -tags sqlite_omit_load_extension,netgo
windows:
CC=x86_64-w64-mingw32-gcc CGO_ENABLED=1 GOOS=windows GOARCH=amd64 go build -v

14
main.go
View File

@@ -1,10 +1,8 @@
package main
import (
"embed"
"encoding/json"
"flag"
"io/fs"
"log"
"msw-open-music/pkg/api"
"msw-open-music/pkg/commonconfig"
@@ -17,21 +15,11 @@ func init() {
flag.StringVar(&ConfigFilePath, "config", "config.json", "backend config file path")
}
//go:embed web/build
var WEBFILES embed.FS
func main() {
var err error
flag.Parse()
WEBFS, err := fs.Sub(WEBFILES, "web/build")
if err != nil {
log.Fatal(err)
}
config := commonconfig.Config{
WEBFS: WEBFS,
}
config := commonconfig.Config{}
configFile, err := os.Open(ConfigFilePath)
if err != nil {
log.Fatal(err)

View File

@@ -1,12 +1,11 @@
package api
import (
"github.com/gorilla/sessions"
"msw-open-music/pkg/commonconfig"
"msw-open-music/pkg/database"
"msw-open-music/pkg/tmpfs"
"net/http"
"github.com/gorilla/sessions"
)
type API struct {
@@ -104,7 +103,7 @@ func NewAPI(config commonconfig.Config) (*API, error) {
apiMux.HandleFunc("/reset", api.HandleReset)
mux.Handle("/api/v1/", http.StripPrefix("/api/v1", api.PermissionMiddleware(apiMux)))
mux.Handle("/", http.StripPrefix("/", http.FileServer(http.FS(config.WEBFS))))
mux.Handle("/", http.StripPrefix("/", http.FileServer(http.Dir("web/build"))))
return api, nil
}

View File

@@ -1,11 +1,8 @@
package commonconfig
import "io/fs"
type Config struct {
APIConfig APIConfig `json:"api"`
TmpfsConfig TmpfsConfig `json:"tmpfs"`
WEBFS fs.FS
}
type APIConfig struct {

View File

@@ -1,20 +0,0 @@
const fs = require("fs");
const esbuild = require("esbuild");
(async () => {
fs.rmSync("build", { recursive: true, force: true });
fs.cpSync("public", "build", { recursive: true });
const result = await esbuild.build({
entryPoints: ["src/index.jsx"],
bundle: true,
outfile: "build/msw-open-music.js",
sourcemap: true,
minify: true,
metafile: true,
});
const text = await esbuild.analyzeMetafile(result.metafile);
console.log(text);
console.log("Build done, output files udner ./build directory");
})();

6
web/build.sh Executable file
View File

@@ -0,0 +1,6 @@
rm -rf build
cp -raf public build
./node_modules/.bin/esbuild src/index.jsx --bundle --outfile=build/msw-open-music.js --alias:react=preact/compat --alias:react-dom=preact/compat --minify --analyze
cat public/index.html | sed "s/%PUBLIC_URL%/$PUBLIC_URL/" > build/index.html
echo "Build done, output files under ./build directory"

View File

@@ -9,6 +9,6 @@
"water.css": "^2.1.1"
},
"scripts": {
"build": "node build.js"
"build": "bash ./build.sh"
}
}

View File

@@ -2,18 +2,18 @@
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="icon" href="./favicon.png" />
<link rel="icon" href="%PUBLIC_URL%/favicon.png" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="description" content="Personal music streaming platform" />
<link rel="apple-touch-icon" href="./favicon.png" />
<link rel="manifest" href="./manifest.json" />
<link rel="stylesheet" href="./msw-open-music.css" />
<link rel="apple-touch-icon" href="%PUBLIC_URL%/favicon.png" />
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
<link rel="stylesheet" href="%PUBLIC_URL%/msw-open-music.css" />
<meta name="mobile-web-app-capable" content="yes" />
<title>MSW Open Music</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<script type="module" src="./msw-open-music.js"></script>
<script type="module" src="%PUBLIC_URL%/msw-open-music.js"></script>
</body>
</html>

View File

@@ -1,3 +1,16 @@
html {
font-size: 1em;
}
body {
margin: auto;
padding-top: 1rem;
max-width: unset;
min-height: 100vh;
}
#root {
display: flex;
justify-content: center;
}
.base {
display: grid;
grid-row-gap: 1em;
@@ -35,10 +48,54 @@
color: rgb(229, 232, 245);
padding: 1em;
}
a.unset {
color: unset;
text-decoration: unset;
}
a.active {
color: deeppink;
background-color: lightgray;
border-radius: 0.39em 0.39em 0 0;
}
.audio-player {
height: 39px;
width: 100%;
}
td.clickable {
cursor: pointer;
}
div.clickable {
cursor: pointer;
}
div.page {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
div.search_toolbar {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-end;
width: 100%;
}
div.feedback {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
button.refresh {
width: 100%;
}
td,
th {
padding-bottom: 0.5em;
padding-top: 0.5em;
}
dialog {
border: solid;
}
.player-options {
display: flex;
}

View File

@@ -1,66 +1,13 @@
#root {
display: flex;
justify-content: center;
}
html {
font-size: 1em;
}
body {
margin: auto;
padding-top: 1rem;
max-width: none;
min-height: 100vh;
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
"Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
margin: 0;
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
sans-serif;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
code {
font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
monospace;
}
a.unset {
color: unset;
text-decoration: unset;
}
a.active {
color: deeppink;
background-color: lightgray;
border-radius: 0.39em 0.39em 0 0;
}
td.clickable {
cursor: pointer;
}
div.clickable {
cursor: pointer;
}
div.page {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
}
div.search_toolbar {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: flex-end;
width: 100%;
}
div.feedback {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
button.refresh {
width: 100%;
}
td,
th {
padding-bottom: 0.5em;
padding-top: 0.5em;
}
dialog {
border: solid;
}

View File

@@ -1,7 +1,7 @@
import React from 'react';
import ReactDOM from 'react-dom';
import 'water.css';
import './index.css';
import 'water.css';
import App from './App';
ReactDOM.render(