Attempt to use dream2nix and vite
This commit is contained in:
Matei Adriel
parent
c31d69df1b
commit
fed8fdcf86
25
.github/workflows/deploy.yaml
vendored
Normal file
25
.github/workflows/deploy.yaml
vendored
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
name: "Deploy"
|
||||
on:
|
||||
pull_request:
|
||||
push:
|
||||
jobs:
|
||||
tests:
|
||||
runs-on: ubuntu-latest
|
||||
steps:
|
||||
- uses: actions/checkout@v3
|
||||
- uses: cachix/install-nix-action@v19
|
||||
with:
|
||||
github_access_token: ${{ secrets.GITHUB_TOKEN }}
|
||||
- uses: cachix/cachix-action@v12
|
||||
with:
|
||||
name: erratic-gate
|
||||
authToken: '${{ secrets.CACHIX_AUTH_TOKEN }}'
|
||||
|
||||
- run: nix build
|
||||
- run: nix flake check
|
||||
|
||||
- name: Deploy
|
||||
uses: peaceiris/actions-gh-pages@v3
|
||||
with:
|
||||
github_token: ${{ secrets.GITHUB_TOKEN }}
|
||||
publish_dir: ./dist
|
||||
|
|
@ -1,18 +0,0 @@
|
|||
module.exports = {
|
||||
presets: [
|
||||
'@babel/preset-env',
|
||||
'@babel/preset-react',
|
||||
'@babel/preset-typescript'
|
||||
],
|
||||
plugins: [
|
||||
'@babel/plugin-proposal-optional-chaining',
|
||||
'@babel/plugin-syntax-dynamic-import',
|
||||
['@babel/plugin-proposal-decorators', { legacy: true }],
|
||||
['@babel/plugin-proposal-class-properties', { loose: true }]
|
||||
],
|
||||
env: {
|
||||
test: {
|
||||
presets: [['@babel/preset-env', { targets: { node: 'current' } }]]
|
||||
}
|
||||
}
|
||||
}
|
||||
1758
dream2nix-packages/erratic-gate/dream-lock.json
Normal file
1758
dream2nix-packages/erratic-gate/dream-lock.json
Normal file
File diff suppressed because it is too large
Load diff
16
flake.nix
16
flake.nix
|
|
@ -1,10 +1,22 @@
|
|||
{
|
||||
inputs.dream2nix.url = "github:nix-community/dream2nix";
|
||||
outputs = inp:
|
||||
inp.dream2nix.lib.makeFlakeOutputs {
|
||||
outputs = inputs:
|
||||
inputs.dream2nix.lib.makeFlakeOutputs {
|
||||
systems = [ "x86_64-linux" ];
|
||||
config.projectRoot = ./.;
|
||||
source = ./.;
|
||||
projects = ./projects.toml;
|
||||
};
|
||||
|
||||
# {{{ Caching and whatnot
|
||||
nixConfig = {
|
||||
# extra-substituters = [
|
||||
# "erratic-gate.cachix.org-1:Ijiu/v//aVpKO4xBqV+2AM2s2uQYOnGCfoj9fYRXxtk" # I think I need this for neovim-nightly?
|
||||
# ];
|
||||
#
|
||||
# extra-trusted-public-keys = [
|
||||
# "nix-community.cachix.org-1:mB9FSh9qf2dCimDSUo8Zy7bkq5CX+/rkCWyvRCYg3Fs="
|
||||
# ];
|
||||
};
|
||||
# }}}
|
||||
}
|
||||
|
|
|
|||
64
index.html
Normal file
64
index.html
Normal file
|
|
@ -0,0 +1,64 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<title>Logic gate simulator</title>
|
||||
|
||||
<meta name="pinterest" content="nopin" />
|
||||
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/icon?family=Material+Icons"
|
||||
/>
|
||||
<meta
|
||||
name="viewport"
|
||||
content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no"
|
||||
/>
|
||||
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css?family=Righteous&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<meta property="og:title" content="Logic gate simulator" />
|
||||
<meta property="og:description" content="A logic gate simulator made for infoeducatie 2019" />
|
||||
<meta property="og:url" content="https://mateiadrielrafael.github.io/logic-gate-simulator/" />
|
||||
|
||||
<meta
|
||||
name="Description"
|
||||
content="A logic gate simulator made for infoeducatie 2019"
|
||||
/>
|
||||
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta charset="UTF-8" />
|
||||
</head>
|
||||
|
||||
<body
|
||||
ondragstart="return false;"
|
||||
ondrop="return false;"
|
||||
oncontextmenu="return false"
|
||||
>
|
||||
<!--The react app is rendered here-->
|
||||
<div id="app"></div>
|
||||
|
||||
<!--The splash screen structure-->
|
||||
<div class="Splash">
|
||||
<!--Loading animation-->
|
||||
<div class="loading">
|
||||
<div class="lds-ripple">
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--In case someone tries to laod this with js disabled-->
|
||||
<noscript> JavaScript must be enabled to run this app. </noscript>
|
||||
</div>
|
||||
|
||||
|
||||
<script type="module" src="/src/index.ts"></script>
|
||||
</body>
|
||||
</html>
|
||||
11357
package-lock.json
generated
11357
package-lock.json
generated
File diff suppressed because it is too large
Load diff
51
package.json
51
package.json
|
|
@ -1,61 +1,30 @@
|
|||
{
|
||||
"name": "logic-gate-simulator",
|
||||
"name": "erratic-gate",
|
||||
"version": "1.0.0",
|
||||
"main": "./src/index.ts",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"dev": "webpack-dev-server --open --mode development",
|
||||
"build": "cross-env NODE_ENV=production webpack",
|
||||
"build:server": "cross-env NODE_ENV=server webpack",
|
||||
"show": "gource -f --start-date \"2019-07-01 12:00\" --key --hide dirnames,filenames,bloom -s 0.3",
|
||||
"start": "node ./dist/server"
|
||||
"dev": "vite",
|
||||
"build": "vite build",
|
||||
"check": "tsc",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/core": "^7.5.5",
|
||||
"@babel/plugin-proposal-class-properties": "^7.5.5",
|
||||
"@babel/plugin-proposal-decorators": "^7.4.4",
|
||||
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
|
||||
"@babel/preset-env": "^7.5.5",
|
||||
"@babel/preset-react": "^7.0.0",
|
||||
"@babel/preset-typescript": "^7.3.3",
|
||||
"@types/deepmerge": "^2.2.0",
|
||||
"@types/express": "^4.17.0",
|
||||
"@types/gh-pages": "^2.0.0",
|
||||
"@types/mainloop.js": "^1.0.5",
|
||||
"@types/react-helmet": "^5.0.8",
|
||||
"@types/node": "^1.0.5",
|
||||
"@types/react-router-dom": "^4.3.4",
|
||||
"babel-loader": "^8.0.6",
|
||||
"babel-plugin-transform-runtime": "^6.23.0",
|
||||
"babel-regenerator-runtime": "^6.5.0",
|
||||
"copy-webpack-plugin": "^5.1.1",
|
||||
"cross-env": "^5.2.0",
|
||||
"css-loader": "^3.0.0",
|
||||
"file-loader": "^4.1.0",
|
||||
"gh-pages": "^2.0.1",
|
||||
"html-webpack-inline-source-plugin": "0.0.10",
|
||||
"html-webpack-plugin": "^3.2.0",
|
||||
"mini-css-extract-plugin": "^0.8.0",
|
||||
"node-sass": "^4.13.1",
|
||||
"optimize-css-assets-webpack-plugin": "^5.0.3",
|
||||
"sass-loader": "^7.1.0",
|
||||
"style-loader": "^0.23.1",
|
||||
"typescript": "^3.8.3",
|
||||
"webpack": "^4.36.1",
|
||||
"webpack-cli": "^3.3.6",
|
||||
"webpack-dev-server": "^3.7.2",
|
||||
"webpack-merge": "^4.2.1",
|
||||
"webpack-node-externals": "^1.7.2"
|
||||
"@vitejs/plugin-react": "^4.0.0-beta.0",
|
||||
"typescript": "^5.0.2",
|
||||
"vite": "^4.3.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"@babel/plugin-proposal-optional-chaining": "^7.9.0",
|
||||
"@eix-js/utils": "0.0.6",
|
||||
"@material-ui/core": "^4.2.1",
|
||||
"deepmerge": "^4.0.0",
|
||||
"express": "^4.17.1",
|
||||
"keycode": "^2.2.0",
|
||||
"mainloop.js": "^1.0.4",
|
||||
"react": "^16.8.6",
|
||||
"react-dom": "^16.8.6",
|
||||
"react-helmet": "^5.2.1",
|
||||
"react-router-dom": "^5.0.1",
|
||||
"react-toastify": "^5.3.2",
|
||||
"rxjs": "^6.5.2",
|
||||
|
|
|
|||
|
|
@ -8,11 +8,11 @@
|
|||
# upstream dream2nix flake:
|
||||
# nix run github:nix-community/dream2nix#detect-projects $source
|
||||
|
||||
[logic-gate-simulator]
|
||||
name = "logic-gate-simulator"
|
||||
[erratic-gate]
|
||||
name = "erratic-gate"
|
||||
relPath = ""
|
||||
subsystem = "nodejs"
|
||||
translator = "package-lock"
|
||||
translators = [ "package-lock", "package-json",]
|
||||
translator = "package-json"
|
||||
builder = "strict-builder"
|
||||
|
||||
[logic-gate-simulator.subsystemInfo]
|
||||
[erratic-gate.subsystemInfo]
|
||||
|
|
|
|||
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
|
|
@ -1,30 +0,0 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<!-- This doesnt work inside react helmetv-->
|
||||
<meta name="pinterest" content="nopin" />
|
||||
</head>
|
||||
|
||||
<body
|
||||
ondragstart="return false;"
|
||||
ondrop="return false;"
|
||||
oncontextmenu="return false"
|
||||
>
|
||||
<!--The react app is rendered here-->
|
||||
<div id="app"></div>
|
||||
|
||||
<!--The splash screen structure-->
|
||||
<div class="Splash">
|
||||
<!--Loading animation-->
|
||||
<div class="loading">
|
||||
<div class="lds-ripple">
|
||||
<div></div>
|
||||
<div></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!--In case someone tries to laod this with js disabled-->
|
||||
<noscript> JavaScript must be enabled to run this app. </noscript>
|
||||
</div>
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -11,7 +11,6 @@ import React, { useEffect } from 'react'
|
|||
import CssBaseline from '@material-ui/core/CssBaseline'
|
||||
import Theme from '@material-ui/styles/ThemeProvider'
|
||||
import Sidebar from './Sidebar'
|
||||
import Head from './Head'
|
||||
import Root from './Root'
|
||||
import LogicGatePage from '../../logic-gates/components/LogicGatesPage'
|
||||
import { loadSubject } from '../subjects/loadedSubject'
|
||||
|
|
@ -25,7 +24,6 @@ const App = () => {
|
|||
|
||||
return (
|
||||
<>
|
||||
<Head />
|
||||
<CssBaseline />
|
||||
|
||||
<Theme theme={muiTheme}>
|
||||
|
|
|
|||
|
|
@ -1,45 +0,0 @@
|
|||
import Helmet from 'react-helmet'
|
||||
import React from 'react'
|
||||
|
||||
const title = 'Logic gate simulator'
|
||||
const description = 'A logic gate simulator made for infoeducatie 2019'
|
||||
const url = 'https://logic-gate-simulator.herokuapp.com/'
|
||||
|
||||
const Head = () => {
|
||||
return (
|
||||
<Helmet>
|
||||
<title>{title}</title>
|
||||
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700&display=swap"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
href="https://fonts.googleapis.com/icon?family=Material+Icons"
|
||||
/>
|
||||
<meta
|
||||
name="viewport"
|
||||
content="minimum-scale=1, initial-scale=1, width=device-width, shrink-to-fit=no"
|
||||
/>
|
||||
|
||||
<link
|
||||
href="https://fonts.googleapis.com/css?family=Righteous&display=swap"
|
||||
rel="stylesheet"
|
||||
/>
|
||||
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta property="og:url" content={url} />
|
||||
|
||||
<meta
|
||||
name="Description"
|
||||
content="A logic gate simulator made for infoeducatie 2019"
|
||||
/>
|
||||
|
||||
<link rel="icon" href={require('../../../assets/favicon.ico')} />
|
||||
</Helmet>
|
||||
)
|
||||
}
|
||||
|
||||
export default Head
|
||||
|
|
@ -117,7 +117,7 @@ const GateRawProperty = ({
|
|||
raw.type === 'text' ||
|
||||
raw.type === 'string'
|
||||
) {
|
||||
return (input = (
|
||||
return (
|
||||
<TextField
|
||||
onChange={handleChange}
|
||||
label={displayableName}
|
||||
|
|
@ -126,9 +126,9 @@ const GateRawProperty = ({
|
|||
multiline={raw.type === 'string'}
|
||||
rowsMax={7}
|
||||
/>
|
||||
))
|
||||
)
|
||||
} else if (raw.type === 'boolean') {
|
||||
return (input = (
|
||||
return (
|
||||
<>
|
||||
<span className="checkbox-label">{displayableName}</span>
|
||||
<CheckBox
|
||||
|
|
@ -139,7 +139,7 @@ const GateRawProperty = ({
|
|||
checked={!!outputSnapshot}
|
||||
/>{' '}
|
||||
</>
|
||||
))
|
||||
)
|
||||
}
|
||||
})()
|
||||
|
||||
|
|
|
|||
|
|
@ -70,7 +70,8 @@ export const DefaultGateTemplate: GateTemplate = {
|
|||
enabled: false,
|
||||
color: 'white'
|
||||
},
|
||||
category: categories.basic
|
||||
category: categories.basic,
|
||||
info: []
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -92,4 +92,5 @@ export interface GateTemplate {
|
|||
enabled: boolean
|
||||
}
|
||||
category: number // for better sorting
|
||||
info: string[]
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,16 +0,0 @@
|
|||
import express, { static as _static } from 'express'
|
||||
import { resolve } from 'path'
|
||||
|
||||
// create express app
|
||||
const app = express()
|
||||
|
||||
// serve static assets
|
||||
app.use(_static(__dirname))
|
||||
|
||||
// serve single page application
|
||||
app.get('*', (rex, res) => {
|
||||
res.sendFile(resolve(__dirname, 'index.html'))
|
||||
})
|
||||
|
||||
// listen to the port from .env (default to 8080)
|
||||
app.listen(process.env.PORT || 8080)
|
||||
1
src/vite-env.d.ts
vendored
Normal file
1
src/vite-env.d.ts
vendored
Normal file
|
|
@ -0,0 +1 @@
|
|||
/// <reference types="vite/client" />
|
||||
|
|
@ -1,14 +1,29 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"moduleResolution": "node",
|
||||
"esModuleInterop": true,
|
||||
"jsx": "preserve",
|
||||
"experimentalDecorators": true,
|
||||
"target": "ESNext",
|
||||
"lib": [ "DOM", "DOM.Iterable", "ESNext" ],
|
||||
"module": "ESNext",
|
||||
"skipLibCheck": true,
|
||||
|
||||
/* Bundler mode */
|
||||
"moduleResolution": "bundler",
|
||||
"allowImportingTsExtensions": true,
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"noEmit": true,
|
||||
"jsx": "react-jsx",
|
||||
|
||||
/* Features */
|
||||
"experimentalDecorators": true,
|
||||
"downlevelIteration": true,
|
||||
"strictNullChecks": true,
|
||||
"module": "esnext"
|
||||
"strictNullChecks": true
|
||||
},
|
||||
"exclude": ["node_modules"],
|
||||
"include": ["src"]
|
||||
"include": [
|
||||
"src"
|
||||
],
|
||||
"references": [
|
||||
{
|
||||
"path": "./tsconfig.node.json"
|
||||
}
|
||||
]
|
||||
}
|
||||
|
|
|
|||
12
tsconfig.node.json
Normal file
12
tsconfig.node.json
Normal file
|
|
@ -0,0 +1,12 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"composite": true,
|
||||
"skipLibCheck": true,
|
||||
"module": "ESNext",
|
||||
"moduleResolution": "bundler",
|
||||
"allowSyntheticDefaultImports": true
|
||||
},
|
||||
"include": [
|
||||
"vite.config.ts"
|
||||
]
|
||||
}
|
||||
7
vite.config.ts
Normal file
7
vite.config.ts
Normal file
|
|
@ -0,0 +1,7 @@
|
|||
import { defineConfig } from 'vite'
|
||||
import react from '@vitejs/plugin-react'
|
||||
|
||||
// https://vitejs.dev/config/
|
||||
export default defineConfig({
|
||||
plugins: [react()],
|
||||
})
|
||||
|
|
@ -1,171 +0,0 @@
|
|||
const { resolve } = require('path')
|
||||
const HtmlWebpackPlugin = require('html-webpack-plugin')
|
||||
const HtmlWebpackInlineSourcePlugin = require('html-webpack-inline-source-plugin')
|
||||
const MiniCssExtractPlugin = require('mini-css-extract-plugin')
|
||||
const OptimizeCssAssetsWebpackPlugin = require('optimize-css-assets-webpack-plugin')
|
||||
const webpackMerge = require('webpack-merge')
|
||||
const nodeExternals = require('webpack-node-externals')
|
||||
const CopyPlugin = require('copy-webpack-plugin')
|
||||
|
||||
const isProduction = process.env.NODE_ENV === 'production'
|
||||
|
||||
const projectRoot = resolve(__dirname)
|
||||
const sourceFolder = resolve(projectRoot, 'src')
|
||||
const buildFolder = resolve(projectRoot, 'dist')
|
||||
const htmlTemplateFile = resolve(sourceFolder, 'index.html')
|
||||
|
||||
const babelRule = {
|
||||
test: /\.(js|tsx?)$/,
|
||||
use: 'babel-loader'
|
||||
}
|
||||
|
||||
const fileRule = {
|
||||
test: /\.(png|svg|jpg|gif|ico)$/,
|
||||
use: ['file-loader']
|
||||
}
|
||||
|
||||
const cssAndSass = [
|
||||
isProduction
|
||||
? MiniCssExtractPlugin.loader
|
||||
: {
|
||||
loader: 'style-loader',
|
||||
options: {
|
||||
singleton: true
|
||||
}
|
||||
},
|
||||
'css-loader'
|
||||
]
|
||||
|
||||
const cssRule = {
|
||||
test: /\.css$/,
|
||||
use: cssAndSass
|
||||
}
|
||||
|
||||
const sassRule = {
|
||||
test: /\.scss$/,
|
||||
use: [
|
||||
...cssAndSass,
|
||||
{
|
||||
loader: 'sass-loader',
|
||||
options: {
|
||||
includePaths: [sourceFolder]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
|
||||
const serverConfig = {
|
||||
mode: 'production',
|
||||
target: 'node',
|
||||
externals: [nodeExternals()],
|
||||
module: {
|
||||
rules: [babelRule]
|
||||
},
|
||||
resolve: {
|
||||
extensions: ['.ts', '.js', '.json']
|
||||
},
|
||||
entry: [resolve(sourceFolder, 'server')],
|
||||
output: {
|
||||
filename: 'server.js',
|
||||
path: buildFolder,
|
||||
publicPath: '/'
|
||||
},
|
||||
node: {
|
||||
__dirname: false
|
||||
},
|
||||
plugins: [
|
||||
new CopyPlugin([
|
||||
{
|
||||
from: resolve(sourceFolder, 'public'),
|
||||
to: buildFolder
|
||||
}
|
||||
])
|
||||
]
|
||||
}
|
||||
|
||||
const baseConfig = {
|
||||
mode: 'none',
|
||||
entry: ['babel-regenerator-runtime', resolve(sourceFolder, 'index')],
|
||||
output: {
|
||||
filename: 'js/[name].js',
|
||||
path: buildFolder,
|
||||
publicPath: '/'
|
||||
},
|
||||
module: {
|
||||
rules: [babelRule, sassRule, cssRule, fileRule]
|
||||
},
|
||||
resolve: {
|
||||
extensions: [
|
||||
'.js',
|
||||
'.ts',
|
||||
'.tsx',
|
||||
'.scss',
|
||||
'.png',
|
||||
'.svg',
|
||||
'.jpg',
|
||||
'.gif'
|
||||
]
|
||||
}
|
||||
}
|
||||
|
||||
const devConfig = {
|
||||
mode: 'development',
|
||||
plugins: [
|
||||
new HtmlWebpackPlugin({
|
||||
template: htmlTemplateFile,
|
||||
chunksSortMode: 'dependency'
|
||||
})
|
||||
],
|
||||
devtool: 'inline-source-map',
|
||||
devServer: {
|
||||
historyApiFallback: true
|
||||
}
|
||||
}
|
||||
|
||||
const prodConfig = {
|
||||
mode: 'production',
|
||||
optimization: {
|
||||
minimize: true,
|
||||
nodeEnv: 'production'
|
||||
},
|
||||
plugins: [
|
||||
new MiniCssExtractPlugin({
|
||||
filename: 'css/[name].min.css'
|
||||
}),
|
||||
new OptimizeCssAssetsWebpackPlugin(),
|
||||
new HtmlWebpackPlugin({
|
||||
template: htmlTemplateFile,
|
||||
minify: {
|
||||
removeComments: true,
|
||||
collapseWhitespace: true,
|
||||
removeRedundantAttributes: true,
|
||||
useShortDoctype: true,
|
||||
removeEmptyAttributes: true,
|
||||
removeStyleLinkTypeAttributes: true,
|
||||
keepClosingSlash: true,
|
||||
minifyJS: true,
|
||||
minifyCSS: true,
|
||||
minifyURLs: true
|
||||
},
|
||||
inject: true
|
||||
// favicon: faviconPath
|
||||
}),
|
||||
new HtmlWebpackInlineSourcePlugin()
|
||||
],
|
||||
devtool: 'source-map'
|
||||
}
|
||||
|
||||
function getFinalConfig() {
|
||||
if (process.env.NODE_ENV === 'production') {
|
||||
console.info('Running production config')
|
||||
return [webpackMerge(baseConfig, prodConfig), serverConfig]
|
||||
} else if (process.env.NODE_ENV === 'server') {
|
||||
console.info('Running server config')
|
||||
return [serverConfig]
|
||||
}
|
||||
|
||||
console.info('Running development config')
|
||||
return webpackMerge(baseConfig, devConfig)
|
||||
}
|
||||
|
||||
module.exports = getFinalConfig()
|
||||
Loading…
Reference in a new issue