diff --git a/Makefile b/Makefile index eda18a6..30952fc 100644 --- a/Makefile +++ b/Makefile @@ -4,12 +4,13 @@ SINGLE_BRANCH_MAIN=--branch main --single-branch SINGLE_BRANCH=--branch master --single-branch SHALLOW=--depth 1 -all: build +all: public .PHONY: public public: \ + libs/openscad \ public/openscad.js \ - public/openscad-worker-inlined.js \ + public/openscad.wasm \ public/libraries/fonts.zip \ public/libraries/NopSCADlib.zip \ public/libraries/BOSL.zip \ @@ -27,26 +28,49 @@ public: \ clean: rm -fR libs build - rm -fR public/openscad-worker-inlined.js rm -fR public/openscad.{js,wasm} rm -fR public/libraries rm -fR src/wasm -build: public - npm run build +dist/index.js: public + npm run build2 + # mkdir -f build/libraries + # cp -f public/libraries/*.zip build/libraries -src/wasm/openscad.js: - wget ${WASM_BUILD_URL} -O OpenSCAD-WebAssembly.zip - mkdir -p src/wasm - ( cd src/wasm && rm -f openscad.{js,wasm} && unzip ../../OpenSCAD-WebAssembly.zip ) - rm OpenSCAD-WebAssembly.zip - -public/openscad.js: src/wasm/openscad.js - cp src/wasm/openscad.{js,wasm} public - -public/openscad-worker-inlined.js: src/openscad-worker.ts src/wasm/openscad.js +dist/openscad-worker.js: src/openscad-worker.ts npx rollup -c +libs/openscad: + mkdir -p libs/openscad + wget ${WASM_BUILD_URL} -O libs/openscad.zip + ( cd libs/openscad && unzip ../openscad.zip ) + rm libs/openscad.zip + rm -f src/wasm + ln -sf $(shell pwd)/libs/openscad src/wasm + +public/openscad.js: libs/openscad libs/openscad/openscad.js + cp libs/openscad/openscad.{js,wasm} public + +public/openscad.wasm: libs/openscad libs/openscad/openscad.wasm + cp libs/openscad/openscad.wasm public + +# public/openscad-worker-inlined.js: src/openscad-worker.ts src/wasm/openscad.js +# npx rollup -c + +# js/src/openscad-worker.js: src/openscad-worker.ts +# tsc + +# public/openscad-worker-inlined.js: inline-openscad-worker.ts js/src/openscad-worker.js public/openscad.js js/src/filesystem.js js/src/zip-archives.js +# cp src/wasm/openscad.{js,wasm} public +# npx webpack --config webpack.config.js +# tsc src/BrowserFS.d.ts src/openscad-worker.ts --outFile public/openscad-worker-inlined.js --module amd --moduleResolution nodenext +# deno run --allow-net --allow-read --allow-write inline-openscad-worker.ts \ +# js/src/openscad-worker.js \ +# public/openscad.js \ +# public/openscad-worker-inlined.js \ +# https://ochafik.com/openscad/openscad-worker-inlined.js +# cp js/src/{filesystem,zip-archives}.js public + public/libraries/fonts.zip: libs/liberation mkdir -p public/libraries cp fonts.conf libs/liberation diff --git a/README.md b/README.md index 19f9fb8..ef293eb 100644 --- a/README.md +++ b/README.md @@ -4,6 +4,19 @@ WIP revamp of https://github.com/ochafik/openscad-wasm/tree/editor-ochafik.com / Licenses: see [LICENSES](./LICENSES). +## Features + +- Automatic preview on edit (F5), and full rendering on Ctrl+Enter (or F6) +- Syntax highlighting +- Ships with many standard SCAD libraries +- Autocomplete of imports +- Autocomplete of symbols / function calls (pseudo-parses file and its transitive imports) +- + +## TODO + +- Investigate https://www.npmjs.com/package/react-codemirror for mobile editor (Monaco on iOS is terribly broken) +- Link to https://www.npmjs.com/package/monaco-languages MIT JS source for language ## Build Prerequisites: @@ -12,14 +25,23 @@ Prerequisites: * npm * deno +Local dev: + ```bash -make clean - -# When doing local development, ensure the import.meta.url is replaced to localhost: -# (otherwise will get cryptic `RangeError: WebAssembly.Table.get(): invalid index 999948 into function table`) -dev=1 make public +make public npm start +# http://localhost:4000/ +``` +make public +npm run start:prod +# http://localhost:3000/dist/ -# When building a release -make -``` \ No newline at end of file +Deployment (edit "homepage" in `package.json` to match your deployment root!): + +```bash +make public +npm build + +rm -fR ../ochafik.github.io/openscad2 && cp -R dist ../ochafik.github.io/openscad2 +# Now commit and push changes, wait for site update and enjoy! +``` diff --git a/openscad-worker.rollup.config.js b/openscad-worker.rollup.config.js new file mode 100644 index 0000000..f8ba870 --- /dev/null +++ b/openscad-worker.rollup.config.js @@ -0,0 +1,25 @@ +import typescript from 'rollup-plugin-typescript'; +import replace from '@rollup/plugin-replace'; +import packageConfig from './package.json' + +const LOCAL_URL = process.env.LOCAL_URL ?? 'http://localhost:4000/'; +const PUBLIC_URL = process.env.PUBLIC_URL ?? packageConfig.homepage; + +export default [ + { + input: 'src/openscad-worker.ts', + output: { + file: 'dist/openscad-worker.js', + format: 'es' + }, + plugins: [ + typescript({ + rootDir: 'src', + }), + replace({ + preventAssignment: true, + 'import.meta.url': JSON.stringify(process.env.NODE_ENV !== 'production' ? LOCAL_URL : PUBLIC_URL), + }) + ] + }, +]; diff --git a/package.json b/package.json index e704835..77ea67a 100644 --- a/package.json +++ b/package.json @@ -2,28 +2,29 @@ "name": "openscad-playground", "version": "0.1.0", "private": true, + "homepage": "https://ochafik.com/openscad2/", "dependencies": { "@monaco-editor/loader": "^1.3.2", "@monaco-editor/react": "^4.4.6", "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", "@testing-library/user-event": "^13.5.0", + "@types/debug": "^4.1.7", "@types/jest": "^27.5.2", "@types/react": "^18.0.28", "@types/react-dom": "^18.0.11", + "debug": "^4.3.4", "monaco-editor": "^0.36.1", "react": "^18.2.0", "react-dom": "^18.2.0", - "react-scripts": "^5.0.1", "react-stl-viewer": "^2.2.5", + "react-widgets": "^5.8.4", "web-vitals": "^2.1.4" }, "scripts": { - "start": "react-scripts start", - "build": "react-scripts build", - "test": "react-scripts test", - "eject": "react-scripts eject", - "tsc": "tsc" + "start": "concurrently 'npx webpack serve --mode=development' 'NODE_ENV=development npx rollup --config openscad-worker.rollup.config.js --watch'", + "start:prod": "PUBLIC_URL=http://localhost:3000/dist/ npm run build && npx serve", + "build": "NODE_ENV=production npx rollup --config openscad-worker.rollup.config.js && webpack --mode=production" }, "eslintConfig": { "extends": [ @@ -44,12 +45,28 @@ ] }, "devDependencies": { + "@rollup/plugin-html": "^1.0.2", + "@rollup/plugin-node-resolve": "^15.0.1", "@rollup/plugin-typescript": "^11.0.0", "@types/filesystem": "^0.0.32", "@types/node": "^18.15.6", + "@web/rollup-plugin-html": "^1.11.0", + "concurrently": "^7.6.0", + "copy-webpack-plugin": "^11.0.0", + "css-loader": "^6.7.3", + "livereload": "^0.9.3", "rollup": "^2.79.1", + "rollup-plugin-babel": "^4.4.0", + "rollup-plugin-css": "^1.0.10", + "rollup-plugin-postcss": "^4.0.2", + "rollup-plugin-typescript": "^1.0.1", + "rollup-plugin-typescript2": "^0.34.1", + "rollup-watch": "^4.3.1", + "serve": "^14.2.0", "ts-loader": "^9.4.2", "tslib": "^2.5.0", - "webpack-cli": "^5.0.1" + "webpack": "^5.76.3", + "webpack-cli": "^5.0.1", + "webpack-dev-server": "^4.13.1" } } diff --git a/public/index.html b/public/index.html index 13d2306..aa2c8e6 100644 --- a/public/index.html +++ b/public/index.html @@ -4,9 +4,11 @@ - + - + + + @@ -16,9 +18,9 @@ name="description" content="OpenSCAD Playground: edit .scad models and render them to STL from the browser (WebAssembly build OpenSCAD, with Monaco editor and STL Viewer)" /> - + - +