diff --git a/common/src/icon.png b/common/src/icon.png deleted file mode 100644 index dc2f73d..0000000 Binary files a/common/src/icon.png and /dev/null differ diff --git a/index.js b/index.js index f3ffd02..2cbc319 100755 --- a/index.js +++ b/index.js @@ -1,330 +1,162 @@ #!/usr/bin/env node -import fs from 'node:fs/promises' -import util from 'node:util' -import path from 'node:path' -import { exec as ecp, spawn } from 'node:child_process' -import os from 'node:os' - -const exec = util.promisify(ecp) -const __dirname = path.dirname(import.meta.url).replace(`file://${os.platform() === 'win32' ? '/' : ''}`, '') -const DEFAULT_TEMPLATE = 'vanilla' - -async function copyFileOrFolder (source, target) { - const stats = await fs.stat(source) - - if (stats.isFile()) { - await fs.mkdir(path.dirname(target), { recursive: true }) - await fs.copyFile(source, target) - } else if (stats.isDirectory()) { - await fs.mkdir(target, { recursive: true }) - - const files = await fs.readdir(source) - - for (const file of files) { - const sourceFile = path.join(source, file) - const targetFile = path.join(target, file) - - await copyFileOrFolder(sourceFile, targetFile) - } - } -} - -const cp = async (a, b) => copyFileOrFolder( - path.resolve(a), - path.join(b, path.basename(a)) -) - -async function help (templateNames) { - console.log(`usage: npm create socket-app [${templateNames.join(' | ')}]`) -} - -async function install () { +import { execSync, spawn } from 'node:child_process' +import { resolve } from 'node:path' +import { readFileSync, writeFileSync, existsSync } from 'node:fs' + +const NPM = 'npm' + +const CSP = ` +` + +function getPackageManager (userAgent) { + if (typeof userAgent !== 'string') return NPM + const [packageManager] = userAgent.split(' ') + const [packageManagerName] = packageManager.split('/') + return packageManagerName ?? NPM } -const DEFAULT_DEPS = [ -] - -const DEFAULT_DEV_DEPS = [ -] - -const templates = {} - -templates.vanilla = { - devDeps: ['esbuild'] -} -templates.tonic = { - deps: ['@socketsupply/tonic'], - devDeps: ['esbuild'] -} -templates.react = { - deps: ['react', 'react-dom'], - devDeps: ['esbuild'] -} -templates.vue = { - deps: ['vue'], - devDeps: ['vite', '@vitejs/plugin-vue'] -} -templates.svelte = { - deps: ['svelte'], - devDeps: ['vite', '@sveltejs/vite-plugin-svelte'] +function getViteCreateCommand ({ packageManager, projectName = '', restViteOptions }) { + const rest = restViteOptions.length === 0 + ? '' + : ` ${packageManager === NPM ? '--' : ''} ${restViteOptions.join(' ')}` + return `${packageManager} create vite@latest ${projectName}${rest}` } -templates['react-ts'] = { - deps: ['react', 'react-dom', 'typescript', '@types/react', '@types/react-dom', '@types/node'], - devDeps: ['esbuild'] -} - -async function main (argv) { - const templateName = argv[0] ?? DEFAULT_TEMPLATE - - const templateNames = await fs.readdir(path.join(__dirname, 'templates')) - - if (argv.find(s => s.includes('-h'))) { - return help(templateNames) - } - - if (templateName && templateNames.findIndex(s => s === templateName) === -1) { - console.error(`Unable to find template "${templateName}"`) - return help(templateNames) - } - - // - // Check if the ssc command is installed, if not install it. - // - try { - await exec('ssc') - } catch (err) { - if (err.code === 127) await install() - } - - // - // If the current directory is not empty, refuse to initialize it. - // Empty excludes the following list of files from the directory. - // - const accepted = [ - '.DS_Store', - '.git', - '.gitattributes', - '.gitignore', - '.gitlab-ci.yml', - '.hg', - '.hgcheck', - '.hgignore', - '.idea', - '.npmignore', - '.travis.yml', - 'docs', - 'LICENSE', - 'README.md', - 'mkdocs.yml', - 'Thumbs.db' - ] - - try { - const entries = (await fs.readdir(process.cwd())) - .filter(file => !accepted.includes(file)) - - if (entries.length) { - process.stdout.write('\nThe current directory is not empty\n') - process.exit(1) - } - } catch (err) { - process.stderr.write(`\nUnable to read the current directory: ${err.stack ?? err.message}\n`) - process.exit(1) - } - - // - // Create a package.json that has the module and a basic build setup. - // - try { - process.stdout.write('Initializing npm package...') - await exec('npm init -y') - } catch (err) { - process.stderr.write(`Unable to run npm init: ${err.stack ?? err.message}\n`) - process.exit(1) - } - process.stdout.write('Ok.\n') - // - // Install an opinionated base of modules for building a simple app. - // - const devDeps = [ - ...DEFAULT_DEV_DEPS, - ...templates[templateName]?.devDeps ?? [] - ] +const [projectName, ...restViteOptions] = process.argv.slice(2) +const packageManager = getPackageManager(process.env.npm_config_user_agent) +const viteCreateCommand = getViteCreateCommand({ + packageManager, + projectName, + restViteOptions +}) - if (devDeps.length > 0) { - try { - process.stdout.write('Installing developer dependencies...') - await exec(`npm install -D ${devDeps.join(' ')}`) - } catch (err) { - process.stderr.write(`\nUnable to run npm install: ${err.stack ?? err.message}\n`) - process.exit(1) - } - - process.stdout.write('Ok.\n') - } - - const deps = [ - ...DEFAULT_DEPS, - ...templates[templateName]?.deps ?? [] - ] - - try { - await exec('ssc --version') - } catch (err) { - process.stdout.write('Installing \'@socketsupply/socket\' locally (ssc not in PATH)\n') - deps.push('@socketsupply/socket') - } - - try { - process.stdout.write('Installing dependencies...\n') - await exec(`npm install ${deps.join(' ')} --save`) - } catch (err) { - process.stderr.write(`\nUnable to run npm install: ${err.stack ?? err.message}\n`) - process.exit(1) - } - process.stdout.write('Ok.\n') +process.stdout.write(`\nCreating a vite project with command:\n${viteCreateCommand}\n\n`) - process.stdout.write('Adding package scripts...') - let pkg +const viteProcess = spawn(viteCreateCommand, [], { + shell: true, + stdio: 'inherit', + encoding: 'utf-8' +}) - try { - pkg = JSON.parse(await fs.readFile('package.json')) - } catch (err) { - process.stderr.write(`\nUnable to read package.json: ${err.stack ?? err.message}\n`) - process.exit(1) - } - - pkg.type = 'module' - pkg.scripts['init-project'] = 'ssc init' - pkg.scripts.start = 'ssc build -r -o' - pkg.scripts.build = 'ssc build -o' - pkg.scripts.test = 'ssc build -r -o --test=./test/index.js --headless' +viteProcess.on('close', (code) => { + const cwd = resolve(process.cwd(), projectName) try { - fs.writeFile('package.json', JSON.stringify(pkg, 2, 2)) - } catch (err) { - process.stderr.write(`\nUnable to write package.json: ${err.stack ?? err.message}\n`) - process.exit(1) + execSync('ssc --version', { + stdio: 'ignore' + }) + } catch { + process.stdout.write('Installing \'@socketsupply/socket\' locally (ssc not in PATH)\n\n') + execSync('npm install @socketsupply/socket --save-dev') } - process.stdout.write('Ok.\n') - - // - // Initialize the current directory as a socket app. - // try { - process.stdout.write('Creating socket files...') - // Use spawn so we can pass stdio, fte is interactive - const initProcess = spawn( - `npm${os.platform() === 'win32' ? '.cmd' : ''}`, - ['run', 'init-project'], - { - stdio: [process.stdin, process.stdout, process.stderr] - }) - await new Promise((resolve, reject) => { - initProcess.on('close', resolve).on('error', reject) + execSync('npm install', { + cwd, + stdio: 'inherit' }) - } catch (err) { - process.stderr.write(`\nUnable to create socket files: ${err.stack ?? err.message}\n`) - } - process.stdout.write('Ok.\n') - - // - // Initialize tsconfig.json when react_ts - // - if (templateName === 'react-ts') { - try { - process.stdout.write('Creating tsconfig...') - await exec( - 'npx tsc --init --declaration --allowJs --emitDeclarationOnly --jsx react-jsx --lib "dom","dom.iterable","esnext" --outDir dist' - ) - } catch (err) { - process.stderr.write( - `\nFailed to create tsconfig: ${err.stack ?? err.message}\n` + } catch (error) { + // create-vite operation was cancelled + if (error.code === 'ENOENT') process.exit(0) + } + + process.stdout.write('\nAdding the socket.ini file to the project\n') + + execSync(`ssc init --name=${projectName}`, { + cwd, + stdio: 'inherit' + }) + + process.stdout.write('\nPatching socket.ini for the create-vite\n') + + const socketIniPath = resolve(cwd, 'socket.ini') + const socketIni = readFileSync(socketIniPath, 'utf-8') + const modifiedSocketIni = socketIni + .replace( + 'copy = "src"', + 'copy = "dist"' + ) + .replace( + '; script = "npm run build"', + 'script = "npm run build"' + ) + writeFileSync(socketIniPath, modifiedSocketIni, 'utf8') + + process.stdout.write('\nPatching index.html for the create-vite\n') + + const indexHTMLPath = resolve(cwd, 'index.html') + const indexHTML = readFileSync(indexHTMLPath, 'utf-8') + const modifiedData = indexHTML.replace('', '\n' + CSP + '\n') + writeFileSync(indexHTMLPath, modifiedData, 'utf8') + + // So TypeScript doesn't complain about about String#startsWith in the vite.config.ts + if (existsSync(resolve(cwd, 'tsconfig.node.json'))) { + process.stdout.write('\nPatching tsconfig.node.json\n') + + const tsconfigNodeJSONPath = resolve(cwd, 'tsconfig.node.json') + const tsconfigNodeJSON = readFileSync(tsconfigNodeJSONPath, 'utf-8') + + if (!tsconfigNodeJSON.includes('"lib": ["ESNext"],')) { + const modifiedTsconfigNodeJSON = tsconfigNodeJSON.replace( + '"compilerOptions": {', + '"compilerOptions": {\n "lib": ["ESNext"],' ) - process.exit(1) + writeFileSync(tsconfigNodeJSONPath, modifiedTsconfigNodeJSON, 'utf8') } - - process.stdout.write('Ok.\n') - - try { - process.stdout.write('Setting up TS configuration...') - await fs.writeFile( - 'globals.d.ts', - "declare module 'socket:os'; \ndeclare module 'socket:test'; \ndeclare module 'socket:console'; \ndeclare module 'socket:process';" - ) - } catch (err) { - process.stderr.write( - `Failed to create global.d.ts: ${ - err.stack ?? err.message - }.Please report this issue here: https://github.com/socketsupply/create-socket-app/issues\n` - ) - } - - process.stdout.write('Ok.\n') } - let config - process.stdout.write('Updating project configuration...') + let isViteConfigExists = false + ['js', 'ts'].forEach((ext) => { + // patching the vite.config.js to make socket:* modules external + if (existsSync(resolve(cwd, `vite.config.${ext}`))) { + process.stdout.write('\nPatching vite.config.' + ext + '\n') - try { - config = await fs.readFile('socket.ini', 'utf8') - } catch (err) { - process.stderr.write(`\nUnable to read socket.ini: ${err.stack ?? err.message}\n`) - process.exit(1) - } + const viteConfigPath = resolve(cwd, 'vite.config.js') + const viteConfig = readFileSync(viteConfigPath, 'utf-8') - config = config.split('\n').map((line, i) => { - if (line.includes('name = ')) { - return line.replace(line, `name = "${pkg.name}"`) - } - if (line.includes('copy = ') && !line.startsWith(';')) { - return line.replace(line, `; ${line}`) - } - if (line.includes('script = ')) { - return line.replace(line, 'script = "node build.js"') + // make socket:* modules external for build + if (!viteConfig.includes('external(id)')) { + const modifiedViteConfig = viteConfig.replace( + 'defineConfig({', + 'defineConfig({\n build: {\n rollupOptions: {\n external(id) {\n return id.startsWith(\'socket:\')\n }\n }\n },' + ) + writeFileSync(viteConfigPath, modifiedViteConfig, 'utf8') + } } - // Socket 0.5 compatibility - if (line.includes('forward_arguments = ')) { - return line.replace(line, 'forward_arguments = true') + isViteConfigExists = true + }) + + if (!isViteConfigExists) { + process.stdout.write('\nCreating vite.config.js\n') + + const viteConfigPath = resolve(cwd, 'vite.config.js') + const viteConfig = ` +import { defineConfig } from 'vite' + +// https://vitejs.dev/config/ +export default defineConfig({ + build: { + rollupOptions: { + external(id) { + return id.startsWith('socket:') + } } - return line - }).join('\n') - - try { - await fs.writeFile('socket.ini', config) - } catch (err) { - process.stderr.write(`\nUnable to write socket.ini: ${err.stack ?? err.message}\n`) - process.exit(1) + }, +}) +` + writeFileSync(viteConfigPath, viteConfig, 'utf8') } - process.stdout.write('Ok.\n') - process.stdout.write('Copying project boilerplate...') - - const dirsToCopy = [ - 'common', - `templates/${templateName}` - ] - - let filesToCopy - try { - const filesInGroups = await Promise.all(dirsToCopy.map(dir => fs.readdir(path.join(__dirname, dir)))) - filesToCopy = filesInGroups.map((group, i) => group.map(file => path.join(__dirname, dirsToCopy[i], file))).flat() - } catch (err) { - process.stderr.write(`\nUnable to read template files: ${err.stack ?? err.message}\n`) - } - - try { - await Promise.all(filesToCopy.map(dir => cp(dir, process.cwd()))) - } catch (err) { - process.stderr.write(`\nUnable to copy files: ${err.stack ?? err.message}\n`) - process.exit(1) - } - process.stdout.write('Ok.') - - process.stdout.write('\n\nType \'npm start\' to launch the app\n') -} -main(process.argv.slice(2)) + process.stdout.write(`\nDone!\n\nBuild and run your app with:\nssc build -r ${projectName}`) +}) diff --git a/templates/react-ts/README.md b/templates/react-ts/README.md deleted file mode 100644 index e69de29..0000000 diff --git a/templates/react-ts/build.js b/templates/react-ts/build.js deleted file mode 100644 index 2a76a80..0000000 --- a/templates/react-ts/build.js +++ /dev/null @@ -1,83 +0,0 @@ -// -// This is an example build script for Socket Runtime -// When you run 'ssc build', this script (node build.js) will be run -// -import fs from 'node:fs' -import path from 'node:path' - -import esbuild from 'esbuild' - -const cp = async (a, b) => - fs.promises.cp(path.resolve(a), path.join(b, path.basename(a)), { - recursive: true, - force: true - }) - -async function main () { - const prod = process.argv.find((s) => s.includes('--prod')) - - const params = { - entryPoints: ['src/index.tsx'], - format: 'esm', - bundle: true, - minify: !!prod, - sourcemap: !prod, - external: ['socket:*'] - } - - const watch = process.argv.find((s) => s.includes('--watch=')) - - // - // The second argument to this program will be the target-OS specifc - // directory for where to copy your build artifacts - // - const target = path.resolve(process.argv[2]) - - // - // If the watch command is specified, let esbuild start its server - // - if (watch) { - esbuild.serve({ servedir: path.resolve(watch.split('=')[1]) }, params) - } - - // - // - // - if (!watch) { - await esbuild.build({ - ...params, - outfile: path.join(target, 'index.js') - }) - } - if (process.argv.find((s) => s.includes('--test'))) { - await esbuild.build({ - ...params, - entryPoints: ['test/index.ts'], - outdir: path.join(target, 'test') - }) - } - - // - // Not writing a package json to your project could be a security risk - // - await fs.promises.writeFile( - path.join(target, 'package.json'), - '{ "type": "module", "private": true }' - ) - - if (!target) { - console.log('Did not receive the build target path as an argument!') - process.exit(1) - } - - // - // Copy some files into the new project - // - await Promise.all([ - cp('src/index.html', target), - cp('src/index.css', target), - cp('src/icon.png', target) - ]) -} - -main() diff --git a/templates/react-ts/src/App.tsx b/templates/react-ts/src/App.tsx deleted file mode 100644 index 26106ec..0000000 --- a/templates/react-ts/src/App.tsx +++ /dev/null @@ -1,7 +0,0 @@ -import os from 'socket:os'; -import React from 'react'; - -const App = () => { - return

Hello, {os.platform()}!

; -}; -export default App; diff --git a/templates/react-ts/src/index.css b/templates/react-ts/src/index.css deleted file mode 100644 index bf36a50..0000000 --- a/templates/react-ts/src/index.css +++ /dev/null @@ -1,120 +0,0 @@ -/* Minimal Reset */ -html { - box-sizing: border-box; - font-size: 16px; -} - -*, *:before, *:after { - box-sizing: inherit; -} - -body, h1, h2, h3, h4, h5, h6, p, ol, ul { - margin: 0; - padding: 0; - font-weight: normal; -} - -ol, ul { - list-style: none; -} - -img { - max-width: 100%; - height: auto; -} - -/* Tonic theme */ - -body { - --tonic-body: 'Inter', sans-serif; - --tonic-header: 'Inter Black', sans-serif; - --tonic-subheader: 'Inter Medium', sans-serif; - --tonic-monospace: 'FiraMono', monospace; -} - -@media (prefers-color-scheme: light) { - body, *[theme="light"] { - --tonic-background: rgba(245, 245, 245, 1); - --tonic-background-dark: rgba(238, 238, 238, 1); - --tonic-window: rgba(255, 255, 255, 1); - --tonic-accent: rgba(56, 185, 255, 1); - --tonic-primary: rgba(54, 57, 61, 1); - --tonic-secondary: rgba(160, 160, 160, 1); - --tonic-light: rgba(153, 157, 160, 1); - --tonic-medium: rgba(153, 157, 160, 1); - --tonic-shadow: rgba(150, 150, 150, 0.25); - --tonic-dark: rgba(54, 57, 61, 1); - --tonic-disabled: rgba(152, 161, 175, 1); - --tonic-button-text: rgba(54, 57, 61, 1); - --tonic-button-shadow: rgba(0, 0, 0, 33%); - --tonic-button-background: rgba(245, 245, 245, 1); - --tonic-button-background-hover: rgba(230, 230, 230, 1); - --tonic-button-background-focus: rgba(237, 237, 237, 1); - --tonic-input-text: rgba(54, 57, 61, 1); - --tonic-input-text-hover: rgba(228, 228, 228, 1); - --tonic-input-border: rgba(201, 201, 201, 1); - --tonic-input-border-hover: rgba(54, 57, 61, 1); - --tonic-input-background: rgba(248, 248, 248, 1); - --tonic-input-background-focus: rgba(238, 238, 238, 1); - --tonic-border: rgba(224, 224, 224, 1); - --tonic-border-accent: rgba(206, 206, 206, 1); - --tonic-error: rgba(240, 102, 83, 1); - --tonic-notification: rgba(240, 102, 83, 1); - --tonic-danger: rgba(240, 102, 83, 1); - --tonic-success: rgba(133, 178, 116, 1); - --tonic-warning: rgba(249, 169, 103, 1); - --tonic-info: rgba(153, 157, 160, 1); - --tonic-overlay: rgba(255, 255, 255, 0.75); - } -} - -@media (prefers-color-scheme: dark) { - body, *[theme="dark"] { - --tonic-background: rgba(0, 0, 0, 1); - --tonic-background-dark: rgba(26, 26, 26, 1); - --tonic-window: rgba(32, 32, 32, 1); - --tonic-accent: rgba(56, 185, 255, 1); - --tonic-primary: rgba(242, 242, 242, 1); - --tonic-secondary: rgba(195, 195, 195, 1); - --tonic-medium: rgba(153, 157, 160, 1); - --tonic-dark: rgba(41, 41, 41, 1); - --tonic-shadow: rgba(0, 0, 0, 0.3); - --tonic-disabled: rgba(170, 170, 170, 1); - --tonic-button-text: rgba(255, 255, 255, 1); - --tonic-button-shadow: rgba(0, 0, 0, 1); - --tonic-button-background: rgba(74, 74, 74, 1); - --tonic-button-background-hover: rgba(94, 94, 94, 1); - --tonic-button-background-focus: rgba(84, 84, 84, 1); - --tonic-input-text: rgba(255, 255, 255, 1); - --tonic-input-text-hover: rgba(255, 255, 255, 1); - --tonic-input-background: rgba(12, 12, 12, 1); - --tonic-input-background-focus: rgba(18, 18, 18, 1); - --tonic-input-border: rgba(80, 80, 80, 1); - --tonic-input-border-hover: rgba(105, 105, 105, 1); - --tonic-border: rgba(72, 72, 72, 1); - --tonic-border-accent: rgba(90, 90, 90, 1); - --tonic-error: rgba(240, 102, 83, 1); - --tonic-notification: rgba(240, 102, 83, 1); - --tonic-caution: rgba(240, 102, 83, 1); - --tonic-success: rgba(133, 178, 116, 1); - --tonic-warn: rgba(249, 169, 103, 1); - --tonic-overlay: rgba(0, 0, 0, 0.40); - } -} - -/* Placeholder Styles */ -body { - height: 100vh; - font: -apple-system-body; - background-color: var(--tonic-window); - color: var(--tonic-primary); -} - -h1 { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - font: -apple-system-title0; - font-size: 2.5em; -} diff --git a/templates/react-ts/src/index.html b/templates/react-ts/src/index.html deleted file mode 100644 index 8325fb3..0000000 --- a/templates/react-ts/src/index.html +++ /dev/null @@ -1,23 +0,0 @@ - - - - - - - Hello, World - - -
- - - diff --git a/templates/react-ts/src/index.tsx b/templates/react-ts/src/index.tsx deleted file mode 100644 index 57c211e..0000000 --- a/templates/react-ts/src/index.tsx +++ /dev/null @@ -1,18 +0,0 @@ -import React from 'react'; -import { createRoot } from 'react-dom/client'; -import process from 'socket:process'; - -if (process.env.DEBUG) { - console.log('started in debug mode'); -} - -// components -import App from './App'; - -const root = createRoot(document.getElementById('root') as HTMLElement); - -root.render( - - - -); diff --git a/templates/react-ts/test/index.ts b/templates/react-ts/test/index.ts deleted file mode 100644 index 3571e82..0000000 --- a/templates/react-ts/test/index.ts +++ /dev/null @@ -1,7 +0,0 @@ -import { test } from 'socket:test'; -import os from 'socket:os'; - -test('test', async (t: any) => { - const label1 = document.querySelector('h1')?.textContent; - t.equal(label1, `Hello, ${os.platform()}`, 'label on start is correct'); -}); diff --git a/templates/react-ts/tsconfig.json b/templates/react-ts/tsconfig.json deleted file mode 100644 index 3cd5cfa..0000000 --- a/templates/react-ts/tsconfig.json +++ /dev/null @@ -1,30 +0,0 @@ -{ - "include": [ - "src/*", - "src/**/*", - "tests/*", - "tests/**/*" - ], - "compilerOptions": { - "moduleResolution": "node", - "types": ["@socketsupply/socket"], - "target": "es2022", - "module": "es2022", - "lib": ["es2022", "es6", "dom"], - - "removeComments": false, - - "checkJs": true, - "allowJs": true, - "noEmit": true, - "allowSyntheticDefaultImports": true, - "jsx": "react", - - "strict": true, - - "declaration": true, - "declarationMap": true, - - "baseUrl": "." - } -} diff --git a/templates/react/README.md b/templates/react/README.md deleted file mode 100644 index e69de29..0000000 diff --git a/templates/react/build.js b/templates/react/build.js deleted file mode 100644 index 023aa2d..0000000 --- a/templates/react/build.js +++ /dev/null @@ -1,80 +0,0 @@ -// -// This is an example build script for Socket Runtime -// When you run 'ssc build', this script (node build.js) will be run -// -import fs from 'node:fs' -import path from 'node:path' - -import esbuild from 'esbuild' - -const cp = async (a, b) => fs.promises.cp( - path.resolve(a), - path.join(b, path.basename(a)), - { recursive: true, force: true } -) - -async function main () { - const prod = process.argv.find(s => s.includes('--prod')) - - const params = { - entryPoints: ['src/index.jsx'], - format: 'esm', - bundle: true, - minify: !!prod, - sourcemap: !prod, - external: ['socket:*'] - } - - const watch = process.argv.find(s => s.includes('--watch=')) - - // - // The second argument to this program will be the target-OS specifc - // directory for where to copy your build artifacts - // - const target = path.resolve(process.argv[2]) - - // - // If the watch command is specified, let esbuild start its server - // - if (watch) { - esbuild.serve({ servedir: path.resolve(watch.split('=')[1]) }, params) - } - - // - // - // - if (!watch) { - await esbuild.build({ - ...params, - outfile: path.join(target, 'index.js') - }) - } - if (process.argv.find(s => s.includes('--test'))) { - await esbuild.build({ - ...params, - entryPoints: ['test/index.js'], - outdir: path.join(target, 'test') - }) - } - - // - // Not writing a package json to your project could be a security risk - // - await fs.promises.writeFile(path.join(target, 'package.json'), '{ "type": "module", "private": true }') - - if (!target) { - console.log('Did not receive the build target path as an argument!') - process.exit(1) - } - - // - // Copy some files into the new project - // - await Promise.all([ - cp('src/index.html', target), - cp('src/index.css', target), - cp('src/icon.png', target) - ]) -} - -main() diff --git a/templates/react/src/index.css b/templates/react/src/index.css deleted file mode 100644 index bf36a50..0000000 --- a/templates/react/src/index.css +++ /dev/null @@ -1,120 +0,0 @@ -/* Minimal Reset */ -html { - box-sizing: border-box; - font-size: 16px; -} - -*, *:before, *:after { - box-sizing: inherit; -} - -body, h1, h2, h3, h4, h5, h6, p, ol, ul { - margin: 0; - padding: 0; - font-weight: normal; -} - -ol, ul { - list-style: none; -} - -img { - max-width: 100%; - height: auto; -} - -/* Tonic theme */ - -body { - --tonic-body: 'Inter', sans-serif; - --tonic-header: 'Inter Black', sans-serif; - --tonic-subheader: 'Inter Medium', sans-serif; - --tonic-monospace: 'FiraMono', monospace; -} - -@media (prefers-color-scheme: light) { - body, *[theme="light"] { - --tonic-background: rgba(245, 245, 245, 1); - --tonic-background-dark: rgba(238, 238, 238, 1); - --tonic-window: rgba(255, 255, 255, 1); - --tonic-accent: rgba(56, 185, 255, 1); - --tonic-primary: rgba(54, 57, 61, 1); - --tonic-secondary: rgba(160, 160, 160, 1); - --tonic-light: rgba(153, 157, 160, 1); - --tonic-medium: rgba(153, 157, 160, 1); - --tonic-shadow: rgba(150, 150, 150, 0.25); - --tonic-dark: rgba(54, 57, 61, 1); - --tonic-disabled: rgba(152, 161, 175, 1); - --tonic-button-text: rgba(54, 57, 61, 1); - --tonic-button-shadow: rgba(0, 0, 0, 33%); - --tonic-button-background: rgba(245, 245, 245, 1); - --tonic-button-background-hover: rgba(230, 230, 230, 1); - --tonic-button-background-focus: rgba(237, 237, 237, 1); - --tonic-input-text: rgba(54, 57, 61, 1); - --tonic-input-text-hover: rgba(228, 228, 228, 1); - --tonic-input-border: rgba(201, 201, 201, 1); - --tonic-input-border-hover: rgba(54, 57, 61, 1); - --tonic-input-background: rgba(248, 248, 248, 1); - --tonic-input-background-focus: rgba(238, 238, 238, 1); - --tonic-border: rgba(224, 224, 224, 1); - --tonic-border-accent: rgba(206, 206, 206, 1); - --tonic-error: rgba(240, 102, 83, 1); - --tonic-notification: rgba(240, 102, 83, 1); - --tonic-danger: rgba(240, 102, 83, 1); - --tonic-success: rgba(133, 178, 116, 1); - --tonic-warning: rgba(249, 169, 103, 1); - --tonic-info: rgba(153, 157, 160, 1); - --tonic-overlay: rgba(255, 255, 255, 0.75); - } -} - -@media (prefers-color-scheme: dark) { - body, *[theme="dark"] { - --tonic-background: rgba(0, 0, 0, 1); - --tonic-background-dark: rgba(26, 26, 26, 1); - --tonic-window: rgba(32, 32, 32, 1); - --tonic-accent: rgba(56, 185, 255, 1); - --tonic-primary: rgba(242, 242, 242, 1); - --tonic-secondary: rgba(195, 195, 195, 1); - --tonic-medium: rgba(153, 157, 160, 1); - --tonic-dark: rgba(41, 41, 41, 1); - --tonic-shadow: rgba(0, 0, 0, 0.3); - --tonic-disabled: rgba(170, 170, 170, 1); - --tonic-button-text: rgba(255, 255, 255, 1); - --tonic-button-shadow: rgba(0, 0, 0, 1); - --tonic-button-background: rgba(74, 74, 74, 1); - --tonic-button-background-hover: rgba(94, 94, 94, 1); - --tonic-button-background-focus: rgba(84, 84, 84, 1); - --tonic-input-text: rgba(255, 255, 255, 1); - --tonic-input-text-hover: rgba(255, 255, 255, 1); - --tonic-input-background: rgba(12, 12, 12, 1); - --tonic-input-background-focus: rgba(18, 18, 18, 1); - --tonic-input-border: rgba(80, 80, 80, 1); - --tonic-input-border-hover: rgba(105, 105, 105, 1); - --tonic-border: rgba(72, 72, 72, 1); - --tonic-border-accent: rgba(90, 90, 90, 1); - --tonic-error: rgba(240, 102, 83, 1); - --tonic-notification: rgba(240, 102, 83, 1); - --tonic-caution: rgba(240, 102, 83, 1); - --tonic-success: rgba(133, 178, 116, 1); - --tonic-warn: rgba(249, 169, 103, 1); - --tonic-overlay: rgba(0, 0, 0, 0.40); - } -} - -/* Placeholder Styles */ -body { - height: 100vh; - font: -apple-system-body; - background-color: var(--tonic-window); - color: var(--tonic-primary); -} - -h1 { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - font: -apple-system-title0; - font-size: 2.5em; -} diff --git a/templates/react/src/index.html b/templates/react/src/index.html deleted file mode 100644 index 23c9c77..0000000 --- a/templates/react/src/index.html +++ /dev/null @@ -1,20 +0,0 @@ - - - - - - - Hello, World - - -
- - - diff --git a/templates/react/src/index.jsx b/templates/react/src/index.jsx deleted file mode 100644 index ccf61ff..0000000 --- a/templates/react/src/index.jsx +++ /dev/null @@ -1,16 +0,0 @@ -import process from 'socket:process' -import os from 'socket:os' - -import { createRoot } from 'react-dom/client' -import React from 'react' - -if (process.env.DEBUG) { - console.log('started in debug mode') -} - -function AppContainer () { - return

Hello, {os.platform()}!

-} - -const root = createRoot(document.getElementById('root')) -root.render() diff --git a/templates/react/test/index.js b/templates/react/test/index.js deleted file mode 100644 index 0fd4f1a..0000000 --- a/templates/react/test/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import { test } from 'socket:test' -import os from 'socket:os' - -test('test', async t => { - const label1 = document.querySelector('h1').textContent - t.equal(label1, `Hello, ${os.platform()}`, 'label on start is correct') -}) diff --git a/templates/svelte/.vscode/extensions.json b/templates/svelte/.vscode/extensions.json deleted file mode 100644 index bdef820..0000000 --- a/templates/svelte/.vscode/extensions.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "recommendations": ["svelte.svelte-vscode"] -} diff --git a/templates/svelte/README.md b/templates/svelte/README.md deleted file mode 100644 index e69de29..0000000 diff --git a/templates/svelte/build.js b/templates/svelte/build.js deleted file mode 100644 index 7366735..0000000 --- a/templates/svelte/build.js +++ /dev/null @@ -1,65 +0,0 @@ -// -// This is an example build script for Socket Runtime -// When you run 'ssc build', this script (node build.js) will be run -// -import path from 'node:path' -import fs from 'node:fs' -import { build } from 'vite' -import { svelte } from '@sveltejs/vite-plugin-svelte' - -async function main () { - const prod = process.argv.find(s => s.includes('--prod')) - - const watch = process.argv.find(s => s.includes('--watch=')) - - // - // The second argument to this program will be the target-OS specifc - // directory for where to copy your build artifacts - // - const target = path.resolve(process.argv[2]) - - // - // If the watch command is specified, let esbuild start its server - // - // TODO: Implement watch mode - - // - // - // - if (!watch) { - await build({ - root: path.resolve('./src'), - mode: prod ? 'production' : 'development', - base: './', - plugins: [svelte()], - build: { - outDir: target, - emptyOutDir: false, - sourcemap: !prod, - minify: prod ? 'esbuild' : false, - rollupOptions: { - external: [/socket:.*/] - } - // modulePreload: { - // polyfill: false - // }, - } - }) - } - // TODO: Implement test mode - // if (process.argv.find(s => s.includes('--test'))) { - // ... - // } - - // - // Not writing a package json to your project could be a security risk - // - await fs.promises.writeFile(path.join(target, 'package.json'), '{ "type": "module", private": true }') - - if (!target) { - console.log('Did not receive the build target path as an argument!') - process.exit(1) - } -} - -main() diff --git a/templates/svelte/src/App.svelte b/templates/svelte/src/App.svelte deleted file mode 100644 index c869bad..0000000 --- a/templates/svelte/src/App.svelte +++ /dev/null @@ -1,32 +0,0 @@ - - -
-
- -
-

Vite + Svelte (on {toProperCase(os.platform())})

- -
- -
-
- - diff --git a/templates/svelte/src/app.css b/templates/svelte/src/app.css deleted file mode 100644 index bcc7233..0000000 --- a/templates/svelte/src/app.css +++ /dev/null @@ -1,81 +0,0 @@ -:root { - font-family: Inter, Avenir, Helvetica, Arial, sans-serif; - font-size: 16px; - line-height: 24px; - font-weight: 400; - - color-scheme: light dark; - color: rgba(255, 255, 255, 0.87); - background-color: #242424; - - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -webkit-text-size-adjust: 100%; -} - -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - -body { - margin: 0; - display: flex; - place-items: center; - min-width: 320px; - min-height: 100vh; -} - -h1 { - font-size: 3.2em; - line-height: 1.1; -} - -.card { - padding: 2em; -} - -#app { - max-width: 1280px; - margin: 0 auto; - padding: 2rem; - text-align: center; -} - -button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.6em 1.2em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - background-color: #1a1a1a; - cursor: pointer; - transition: border-color 0.25s; -} -button:hover { - border-color: #646cff; -} -button:focus, -button:focus-visible { - outline: 4px auto -webkit-focus-ring-color; -} - -@media (prefers-color-scheme: light) { - :root { - color: #213547; - background-color: #ffffff; - } - a:hover { - color: #747bff; - } - button { - background-color: #f9f9f9; - } -} diff --git a/templates/svelte/src/assets/svelte.svg b/templates/svelte/src/assets/svelte.svg deleted file mode 100644 index c5e0848..0000000 --- a/templates/svelte/src/assets/svelte.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/templates/svelte/src/index.html b/templates/svelte/src/index.html deleted file mode 100644 index 10556fe..0000000 --- a/templates/svelte/src/index.html +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - - - Vite + Svelte - - -
- - - diff --git a/templates/svelte/src/lib/Counter.svelte b/templates/svelte/src/lib/Counter.svelte deleted file mode 100644 index e45f903..0000000 --- a/templates/svelte/src/lib/Counter.svelte +++ /dev/null @@ -1,10 +0,0 @@ - - - diff --git a/templates/svelte/src/main.js b/templates/svelte/src/main.js deleted file mode 100644 index 5c1f795..0000000 --- a/templates/svelte/src/main.js +++ /dev/null @@ -1,8 +0,0 @@ -import './app.css' -import App from './App.svelte' - -const app = new App({ - target: document.getElementById('app') -}) - -export default app diff --git a/templates/svelte/src/svelte.svg b/templates/svelte/src/svelte.svg deleted file mode 100644 index c5e0848..0000000 --- a/templates/svelte/src/svelte.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/templates/svelte/src/vite-env.d.ts b/templates/svelte/src/vite-env.d.ts deleted file mode 100644 index 4078e74..0000000 --- a/templates/svelte/src/vite-env.d.ts +++ /dev/null @@ -1,2 +0,0 @@ -/// -/// diff --git a/templates/tonic/README.md b/templates/tonic/README.md deleted file mode 100644 index e69de29..0000000 diff --git a/templates/tonic/build.js b/templates/tonic/build.js deleted file mode 100644 index ebc6d4f..0000000 --- a/templates/tonic/build.js +++ /dev/null @@ -1,80 +0,0 @@ -// -// This is an example build script for Socket Runtime -// When you run 'ssc build', this script (node build.js) will be run -// -import fs from 'node:fs' -import path from 'node:path' - -import esbuild from 'esbuild' - -const cp = async (a, b) => fs.promises.cp( - path.resolve(a), - path.join(b, path.basename(a)), - { recursive: true, force: true } -) - -async function main () { - const prod = process.argv.find(s => s.includes('--prod')) - - const params = { - entryPoints: ['src/index.js'], - format: 'esm', - bundle: true, - minify: !!prod, - sourcemap: !prod, - external: ['socket:*'] - } - - const watch = process.argv.find(s => s.includes('--watch=')) - - // - // The second argument to this program will be the target-OS specifc - // directory for where to copy your build artifacts - // - const target = path.resolve(process.argv[2]) - - // - // If the watch command is specified, let esbuild start its server - // - if (watch) { - esbuild.serve({ servedir: path.resolve(watch.split('=')[1]) }, params) - } - - // - // - // - if (!watch) { - await esbuild.build({ - ...params, - outdir: target - }) - } - if (process.argv.find(s => s.includes('--test'))) { - await esbuild.build({ - ...params, - entryPoints: ['test/index.js'], - outdir: path.join(target, 'test') - }) - } - - // - // Not writing a package json to your project could be a security risk - // - await fs.promises.writeFile(path.join(target, 'package.json'), '{ "private": true }') - - if (!target) { - console.log('Did not receive the build target path as an argument!') - process.exit(1) - } - - // - // Copy some files into the new project - // - await Promise.all([ - cp('src/index.html', target), - cp('src/index.css', target), - cp('src/icon.png', target) - ]) -} - -main() diff --git a/templates/tonic/src/index.css b/templates/tonic/src/index.css deleted file mode 100644 index bf36a50..0000000 --- a/templates/tonic/src/index.css +++ /dev/null @@ -1,120 +0,0 @@ -/* Minimal Reset */ -html { - box-sizing: border-box; - font-size: 16px; -} - -*, *:before, *:after { - box-sizing: inherit; -} - -body, h1, h2, h3, h4, h5, h6, p, ol, ul { - margin: 0; - padding: 0; - font-weight: normal; -} - -ol, ul { - list-style: none; -} - -img { - max-width: 100%; - height: auto; -} - -/* Tonic theme */ - -body { - --tonic-body: 'Inter', sans-serif; - --tonic-header: 'Inter Black', sans-serif; - --tonic-subheader: 'Inter Medium', sans-serif; - --tonic-monospace: 'FiraMono', monospace; -} - -@media (prefers-color-scheme: light) { - body, *[theme="light"] { - --tonic-background: rgba(245, 245, 245, 1); - --tonic-background-dark: rgba(238, 238, 238, 1); - --tonic-window: rgba(255, 255, 255, 1); - --tonic-accent: rgba(56, 185, 255, 1); - --tonic-primary: rgba(54, 57, 61, 1); - --tonic-secondary: rgba(160, 160, 160, 1); - --tonic-light: rgba(153, 157, 160, 1); - --tonic-medium: rgba(153, 157, 160, 1); - --tonic-shadow: rgba(150, 150, 150, 0.25); - --tonic-dark: rgba(54, 57, 61, 1); - --tonic-disabled: rgba(152, 161, 175, 1); - --tonic-button-text: rgba(54, 57, 61, 1); - --tonic-button-shadow: rgba(0, 0, 0, 33%); - --tonic-button-background: rgba(245, 245, 245, 1); - --tonic-button-background-hover: rgba(230, 230, 230, 1); - --tonic-button-background-focus: rgba(237, 237, 237, 1); - --tonic-input-text: rgba(54, 57, 61, 1); - --tonic-input-text-hover: rgba(228, 228, 228, 1); - --tonic-input-border: rgba(201, 201, 201, 1); - --tonic-input-border-hover: rgba(54, 57, 61, 1); - --tonic-input-background: rgba(248, 248, 248, 1); - --tonic-input-background-focus: rgba(238, 238, 238, 1); - --tonic-border: rgba(224, 224, 224, 1); - --tonic-border-accent: rgba(206, 206, 206, 1); - --tonic-error: rgba(240, 102, 83, 1); - --tonic-notification: rgba(240, 102, 83, 1); - --tonic-danger: rgba(240, 102, 83, 1); - --tonic-success: rgba(133, 178, 116, 1); - --tonic-warning: rgba(249, 169, 103, 1); - --tonic-info: rgba(153, 157, 160, 1); - --tonic-overlay: rgba(255, 255, 255, 0.75); - } -} - -@media (prefers-color-scheme: dark) { - body, *[theme="dark"] { - --tonic-background: rgba(0, 0, 0, 1); - --tonic-background-dark: rgba(26, 26, 26, 1); - --tonic-window: rgba(32, 32, 32, 1); - --tonic-accent: rgba(56, 185, 255, 1); - --tonic-primary: rgba(242, 242, 242, 1); - --tonic-secondary: rgba(195, 195, 195, 1); - --tonic-medium: rgba(153, 157, 160, 1); - --tonic-dark: rgba(41, 41, 41, 1); - --tonic-shadow: rgba(0, 0, 0, 0.3); - --tonic-disabled: rgba(170, 170, 170, 1); - --tonic-button-text: rgba(255, 255, 255, 1); - --tonic-button-shadow: rgba(0, 0, 0, 1); - --tonic-button-background: rgba(74, 74, 74, 1); - --tonic-button-background-hover: rgba(94, 94, 94, 1); - --tonic-button-background-focus: rgba(84, 84, 84, 1); - --tonic-input-text: rgba(255, 255, 255, 1); - --tonic-input-text-hover: rgba(255, 255, 255, 1); - --tonic-input-background: rgba(12, 12, 12, 1); - --tonic-input-background-focus: rgba(18, 18, 18, 1); - --tonic-input-border: rgba(80, 80, 80, 1); - --tonic-input-border-hover: rgba(105, 105, 105, 1); - --tonic-border: rgba(72, 72, 72, 1); - --tonic-border-accent: rgba(90, 90, 90, 1); - --tonic-error: rgba(240, 102, 83, 1); - --tonic-notification: rgba(240, 102, 83, 1); - --tonic-caution: rgba(240, 102, 83, 1); - --tonic-success: rgba(133, 178, 116, 1); - --tonic-warn: rgba(249, 169, 103, 1); - --tonic-overlay: rgba(0, 0, 0, 0.40); - } -} - -/* Placeholder Styles */ -body { - height: 100vh; - font: -apple-system-body; - background-color: var(--tonic-window); - color: var(--tonic-primary); -} - -h1 { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - font: -apple-system-title0; - font-size: 2.5em; -} diff --git a/templates/tonic/src/index.html b/templates/tonic/src/index.html deleted file mode 100644 index a57731f..0000000 --- a/templates/tonic/src/index.html +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - - Hello, World - - - - - - - diff --git a/templates/tonic/src/index.js b/templates/tonic/src/index.js deleted file mode 100644 index 84bc426..0000000 --- a/templates/tonic/src/index.js +++ /dev/null @@ -1,20 +0,0 @@ -import Tonic from '@socketsupply/tonic' - -import process from 'socket:process' -import os from 'socket:os' - -if (process.env.DEBUG) { - console.log('started in debug mode') -} - -class AppContainer extends Tonic { - render () { - const platform = os.platform() - - return this.html` -

Hello, ${platform}!

- ` - } -} - -Tonic.add(AppContainer, 'app-container') diff --git a/templates/tonic/test/index.js b/templates/tonic/test/index.js deleted file mode 100644 index 0fd4f1a..0000000 --- a/templates/tonic/test/index.js +++ /dev/null @@ -1,7 +0,0 @@ -import { test } from 'socket:test' -import os from 'socket:os' - -test('test', async t => { - const label1 = document.querySelector('h1').textContent - t.equal(label1, `Hello, ${os.platform()}`, 'label on start is correct') -}) diff --git a/templates/vanilla/README.md b/templates/vanilla/README.md deleted file mode 100644 index e69de29..0000000 diff --git a/templates/vanilla/build.js b/templates/vanilla/build.js deleted file mode 100644 index ebc6d4f..0000000 --- a/templates/vanilla/build.js +++ /dev/null @@ -1,80 +0,0 @@ -// -// This is an example build script for Socket Runtime -// When you run 'ssc build', this script (node build.js) will be run -// -import fs from 'node:fs' -import path from 'node:path' - -import esbuild from 'esbuild' - -const cp = async (a, b) => fs.promises.cp( - path.resolve(a), - path.join(b, path.basename(a)), - { recursive: true, force: true } -) - -async function main () { - const prod = process.argv.find(s => s.includes('--prod')) - - const params = { - entryPoints: ['src/index.js'], - format: 'esm', - bundle: true, - minify: !!prod, - sourcemap: !prod, - external: ['socket:*'] - } - - const watch = process.argv.find(s => s.includes('--watch=')) - - // - // The second argument to this program will be the target-OS specifc - // directory for where to copy your build artifacts - // - const target = path.resolve(process.argv[2]) - - // - // If the watch command is specified, let esbuild start its server - // - if (watch) { - esbuild.serve({ servedir: path.resolve(watch.split('=')[1]) }, params) - } - - // - // - // - if (!watch) { - await esbuild.build({ - ...params, - outdir: target - }) - } - if (process.argv.find(s => s.includes('--test'))) { - await esbuild.build({ - ...params, - entryPoints: ['test/index.js'], - outdir: path.join(target, 'test') - }) - } - - // - // Not writing a package json to your project could be a security risk - // - await fs.promises.writeFile(path.join(target, 'package.json'), '{ "private": true }') - - if (!target) { - console.log('Did not receive the build target path as an argument!') - process.exit(1) - } - - // - // Copy some files into the new project - // - await Promise.all([ - cp('src/index.html', target), - cp('src/index.css', target), - cp('src/icon.png', target) - ]) -} - -main() diff --git a/templates/vanilla/src/index.css b/templates/vanilla/src/index.css deleted file mode 100644 index cd80401..0000000 --- a/templates/vanilla/src/index.css +++ /dev/null @@ -1,40 +0,0 @@ -/* Minimal Reset */ -html { - box-sizing: border-box; - font-size: 16px; - font: -apple-system-body; -} - -*, *:before, *:after { - box-sizing: inherit; -} - -body, h1, h2, h3, h4, h5, h6, p, ol, ul { - margin: 0; - padding: 0; - font-weight: normal; -} - -ol, ul { - list-style: none; -} - -img { - max-width: 100%; - height: auto; -} - -/* Placeholder Styles */ -body { - height: 100vh; -} - -.centered { - position: absolute; - top: 50%; - left: 50%; - transform: translate(-50%, -50%); - font: -apple-system-title0; - font-size: 2.5em; - text-align: center; -} diff --git a/templates/vanilla/src/index.html b/templates/vanilla/src/index.html deleted file mode 100644 index f9043cd..0000000 --- a/templates/vanilla/src/index.html +++ /dev/null @@ -1,23 +0,0 @@ - - - - - - - Hello, World - - -
-

Hello, World

-

Socket Runtime

-
- - - diff --git a/templates/vanilla/src/index.js b/templates/vanilla/src/index.js deleted file mode 100644 index db015a9..0000000 --- a/templates/vanilla/src/index.js +++ /dev/null @@ -1,15 +0,0 @@ -import process from 'socket:process' -import os from 'socket:os' - -if (process.env.DEBUG) { - console.log('started in debug mode') -} - -window.addEventListener('DOMContentLoaded', () => { - const platform = os.platform() - - setTimeout(() => { - const h1 = document.querySelector('h1') - h1.textContent = `Hello, ${platform}!` - }, 2048) -}) diff --git a/templates/vanilla/test/index.js b/templates/vanilla/test/index.js deleted file mode 100644 index bac2980..0000000 --- a/templates/vanilla/test/index.js +++ /dev/null @@ -1,13 +0,0 @@ -import { test } from 'socket:test' -import os from 'socket:os' - -test('test', async t => { - const label1 = document.querySelector('h1').textContent - t.equal(label1, 'Hello, World', 'label on start is correct') - - // sleep 3 seconds - await new Promise(resolve => setTimeout(resolve, 3000)) - - const label2 = document.querySelector('h1').textContent - t.equal(label2, `Hello, ${os.platform()}!`, 'label after 3 seconds is correct') -}) diff --git a/templates/vue/.vscode/extensions.json b/templates/vue/.vscode/extensions.json deleted file mode 100644 index c0a6e5a..0000000 --- a/templates/vue/.vscode/extensions.json +++ /dev/null @@ -1,3 +0,0 @@ -{ - "recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"] -} diff --git a/templates/vue/README.md b/templates/vue/README.md deleted file mode 100644 index e69de29..0000000 diff --git a/templates/vue/build.js b/templates/vue/build.js deleted file mode 100644 index 6d15bb2..0000000 --- a/templates/vue/build.js +++ /dev/null @@ -1,65 +0,0 @@ -// -// This is an example build script for Socket Runtime -// When you run 'ssc build', this script (node build.js) will be run -// -import path from 'node:path' -import fs from 'node:fs' -import { build } from 'vite' -import vue from '@vitejs/plugin-vue' - -async function main () { - const prod = process.argv.find(s => s.includes('--prod')) - - const watch = process.argv.find(s => s.includes('--watch=')) - - // - // The second argument to this program will be the target-OS specifc - // directory for where to copy your build artifacts - // - const target = path.resolve(process.argv[2]) - - // - // If the watch command is specified, let esbuild start its server - // - // TODO: Implement watch mode - - // - // - // - if (!watch) { - await build({ - root: path.resolve('./src'), - mode: prod ? 'production' : 'development', - base: './', - plugins: [vue()], - build: { - outDir: target, - emptyOutDir: false, - sourcemap: !prod, - minify: prod ? 'esbuild' : false, - rollupOptions: { - external: [/socket:.*/] - } - // modulePreload: { - // polyfill: false - // }, - } - }) - } - // TODO: Implement test mode - // if (process.argv.find(s => s.includes('--test'))) { - // ... - // } - - // - // Not writing a package json to your project could be a security risk - // - await fs.promises.writeFile(path.join(target, 'package.json'), '{ "private": true }') - - if (!target) { - console.log('Did not receive the build target path as an argument!') - process.exit(1) - } -} - -main() diff --git a/templates/vue/src/App.vue b/templates/vue/src/App.vue deleted file mode 100644 index 7247053..0000000 --- a/templates/vue/src/App.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - - - diff --git a/templates/vue/src/assets/vue.svg b/templates/vue/src/assets/vue.svg deleted file mode 100644 index 770e9d3..0000000 --- a/templates/vue/src/assets/vue.svg +++ /dev/null @@ -1 +0,0 @@ - \ No newline at end of file diff --git a/templates/vue/src/components/HelloWorld.vue b/templates/vue/src/components/HelloWorld.vue deleted file mode 100644 index ebd56d9..0000000 --- a/templates/vue/src/components/HelloWorld.vue +++ /dev/null @@ -1,23 +0,0 @@ - - - - - diff --git a/templates/vue/src/index.html b/templates/vue/src/index.html deleted file mode 100644 index 3fa9110..0000000 --- a/templates/vue/src/index.html +++ /dev/null @@ -1,21 +0,0 @@ - - - - - - - - Vite + Vue - - -
- - - diff --git a/templates/vue/src/main.js b/templates/vue/src/main.js deleted file mode 100644 index 2425c0f..0000000 --- a/templates/vue/src/main.js +++ /dev/null @@ -1,5 +0,0 @@ -import { createApp } from 'vue' -import './style.css' -import App from './App.vue' - -createApp(App).mount('#app') diff --git a/templates/vue/src/style.css b/templates/vue/src/style.css deleted file mode 100644 index a566a34..0000000 --- a/templates/vue/src/style.css +++ /dev/null @@ -1,90 +0,0 @@ -:root { - font-family: Inter, Avenir, Helvetica, Arial, sans-serif; - font-size: 16px; - line-height: 24px; - font-weight: 400; - - color-scheme: light dark; - color: rgba(255, 255, 255, 0.87); - background-color: #242424; - - font-synthesis: none; - text-rendering: optimizeLegibility; - -webkit-font-smoothing: antialiased; - -moz-osx-font-smoothing: grayscale; - -webkit-text-size-adjust: 100%; -} - -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - -a { - font-weight: 500; - color: #646cff; - text-decoration: inherit; -} -a:hover { - color: #535bf2; -} - -body { - margin: 0; - display: flex; - place-items: center; - min-width: 320px; - min-height: 100vh; -} - -h1 { - font-size: 3.2em; - line-height: 1.1; -} - -button { - border-radius: 8px; - border: 1px solid transparent; - padding: 0.6em 1.2em; - font-size: 1em; - font-weight: 500; - font-family: inherit; - background-color: #1a1a1a; - cursor: pointer; - transition: border-color 0.25s; -} -button:hover { - border-color: #646cff; -} -button:focus, -button:focus-visible { - outline: 4px auto -webkit-focus-ring-color; -} - -.card { - padding: 2em; -} - -#app { - max-width: 1280px; - margin: 0 auto; - padding: 2rem; - text-align: center; -} - -@media (prefers-color-scheme: light) { - :root { - color: #213547; - background-color: #ffffff; - } - a:hover { - color: #747bff; - } - button { - background-color: #f9f9f9; - } -} diff --git a/test.js b/test.js deleted file mode 100644 index 0c62b98..0000000 --- a/test.js +++ /dev/null @@ -1,56 +0,0 @@ -import test from 'node:test' -import assert from 'node:assert' -import tmp from 'p-temporary-directory' -import path from 'node:path' -import cp from 'node:child_process' -import os from 'node:os' -import desm from 'desm' - -const __dirname = desm(import.meta.url) - -const cliPath = path.join(__dirname, 'index.js') - -test('test all the templates', async (t) => { - let dir, cleanup - t.beforeEach(async () => { - [dir, cleanup] = await tmp() - }) - - t.afterEach(async () => { - await cleanup() - }) - - const templates = ['tonic', 'react', 'react-ts', 'vanilla', 'vue', 'svelte'] - - for (const template of templates) { - await t.test(`${template} template`, async (t) => { - await assert.doesNotReject(async () => { - return new Promise((resolve, reject) => { - const child = os.platform() === 'win32' - ? cp.spawn('node', [cliPath, template], { cwd: dir }) - : cp.spawn(cliPath, [template], { cwd: dir }) - - child.stdout.on('data', (data) => { - console.log(`stdout: ${data}`) - }) - - child.stderr.on('data', (data) => { - console.error(`stderr: ${data}`) - }) - - child.on('error', (error) => { - reject(error) - }) - - child.on('close', (code) => { - if (code !== 0) { - reject(new Error(`child process exited with code ${code}`)) - } else { - resolve() - } - }) - }) - }) - }) - } -})