This commit is contained in:
ThaUnknown 2022-03-08 22:33:00 +01:00
parent 74a9a42762
commit 0e32204712
10 changed files with 267 additions and 0 deletions

10
.gitignore vendored Normal file
View file

@ -0,0 +1,10 @@
# OS Specific
.DS_Store
# Build output
dist/
# Dependencies
node_modules/
package-lock.json

33
package.json Normal file
View file

@ -0,0 +1,33 @@
{
"name": "miru",
"version": "0.1.0",
"main": "src/index.js",
"scripts": {
"start": "SET NODE_ENV=development & concurrently \"npm run web:watch\" \"npm run electron:start\"",
"web:watch": "vite",
"electron:start": "electron src",
"build": "vite build && electron-builder"
},
"devDependencies": {
"@sveltejs/vite-plugin-svelte": "^1.0.0-next.30",
"builtin-modules": "^3.2.0",
"concurrently": "^7.0.0",
"electron": "^16.0.10",
"electron-builder": "^22.14.13",
"svelte": "^3.46.4",
"vite": "^2.8.6",
"vite-plugin-commonjs-externals": "^0.1.1"
},
"standard": {
"ignore": [
"bundle.js",
"bundle.map.js"
],
"env": "browser"
},
"build": {
"files": [
"src/**/*"
]
}
}

77
src/index.js Normal file
View file

@ -0,0 +1,77 @@
const { app, BrowserWindow } = require('electron')
const path = require('path')
// Keep a global reference of the window object, if you don't, the window will
// be closed automatically when the JavaScript object is garbage collected.
let mainWindow
function createWindow () {
// Create the browser window.
mainWindow = new BrowserWindow({
width: 800,
height: 600,
backgroundColor: '#2e2c29',
autoHideMenuBar: true,
experimentalFeatures: true,
webPreferences: {
nodeIntegration: true,
contextIsolation: false,
enableBlinkFeatures: 'AudioVideoTracks',
enableRemoteModule: true,
backgroundThrottling: false
},
icon: path.join(__dirname, 'public/favicon.png'),
show: false
})
// mainWindow.removeMenu()
// This block of code is intended for development purpose only.
// Delete this entire block of code when you are ready to package the application.
if (process.env.NODE_ENV !== 'development ') {
// Load production build
mainWindow.loadFile(path.join(__dirname, '/renderer/dist/index.html'))
} else {
// Load vite dev server page
console.log('Development mode')
mainWindow.loadURL('http://localhost:3000/')
}
// Uncomment the following line of code when app is ready to be packaged.
// loadURL(mainWindow);
// Open the DevTools and also disable Electron Security Warning.
// process.env['ELECTRON_DISABLE_SECURITY_WARNINGS'] = true;
// mainWindow.webContents.openDevTools();
// Emitted when the window is closed.
mainWindow.on('closed', function () {
// Dereference the window object, usually you would store windows
// in an array if your app supports multi windows, this is the time
// when you should delete the corresponding element.
mainWindow = null
})
// Emitted when the window is ready to be shown
// This helps in showing the window gracefully.
mainWindow.once('ready-to-show', () => {
mainWindow.show()
})
}
// This method will be called when Electron has finished
// initialization and is ready to create browser windows.
// Some APIs can only be used after this event occurs.
app.on('ready', createWindow)
// Quit when all windows are closed.
app.on('window-all-closed', function () {
// On macOS it is common for applications and their menu bar
// to stay active until the user quits explicitly with Cmd + Q
if (process.platform !== 'darwin') app.quit()
})
app.on('activate', function () {
// On macOS it's common to re-create a window in the app when the
// dock icon is clicked and there are no other windows open.
if (mainWindow === null) createWindow()
})

13
src/renderer/index.html Normal file
View file

@ -0,0 +1,13 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<link rel="icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Miru</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.js"></script>
</body>
</html>

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.1 KiB

View file

@ -0,0 +1,66 @@
<script>
import logo from '@/assets/svelte.png'
import Counter from '@/lib/Counter.svelte'
const process = require('process')
</script>
<main>
<img src={logo} alt="Svelte Logo" />
<h1>Hello world! {process.cwd()}</h1>
<Counter />
<p>
Visit <a href="https://svelte.dev">svelte.dev</a> to learn how to build Svelte
apps.
</p>
<p>
Check out <a href="https://github.com/sveltejs/kit#readme">SvelteKit</a> for
the officially supported framework, also powered by Vite!
</p>
</main>
<style>
:root {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen,
Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
}
main {
text-align: center;
padding: 1em;
margin: 0 auto;
}
img {
height: 16rem;
width: 16rem;
}
h1 {
color: #ff3e00;
text-transform: uppercase;
font-size: 4rem;
font-weight: 100;
line-height: 1.1;
margin: 2rem auto;
max-width: 14rem;
}
p {
max-width: 14rem;
margin: 1rem auto;
line-height: 1.35;
}
@media (min-width: 480px) {
h1 {
max-width: none;
}
p {
max-width: none;
}
}
</style>

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.1 KiB

View file

@ -0,0 +1,34 @@
<script>
let count = 0
const increment = () => {
count += 1
}
</script>
<button on:click={increment}>
Clicks: {count}
</button>
<style>
button {
font-family: inherit;
font-size: inherit;
padding: 1em 2em;
color: #ff3e00;
background-color: rgba(255, 62, 0, 0.1);
border-radius: 2em;
border: 2px solid rgba(255, 62, 0, 0);
outline: none;
width: 200px;
font-variant-numeric: tabular-nums;
cursor: pointer;
}
button:focus {
border: 2px solid #ff3e00;
}
button:active {
background-color: rgba(255, 62, 0, 0.2);
}
</style>

7
src/renderer/src/main.js Normal file
View file

@ -0,0 +1,7 @@
import App from './App.svelte'
const app = new App({
target: document.getElementById('app')
})
export default app

27
vite.config.js Normal file
View file

@ -0,0 +1,27 @@
import path from 'path'
import process from 'process'
import { defineConfig } from 'vite'
import builtinModules from 'builtin-modules'
import { svelte } from '@sveltejs/vite-plugin-svelte'
import commonjsExternals from 'vite-plugin-commonjs-externals'
const commonjsPackages = [
'electron',
'electron/main',
'electron/common',
'electron/renderer',
'original-fs',
...builtinModules
]
// https://vitejs.dev/config/
export default defineConfig({
plugins: [svelte(), commonjsExternals({ externals: commonjsPackages })],
resolve: {
alias: {
'@': path.resolve('src/renderer/src')
}
},
root: path.resolve(process.cwd(), 'src/renderer'),
base: './'
})