Initial conversion to parcel

see #65

.gitignore

@@ -6,3 +6,5 @@ node_modules/
 
 *.log
 dist/
+
+.parcel-cache

gulpfile.ts

@@ -1,13 +1,6 @@
-import { watch, src, dest, series, parallel } from 'gulp'
+import { watch, src, dest, parallel } from 'gulp'
 import { createProject } from 'gulp-typescript'
 import * as typedoc from 'gulp-typedoc'
-import * as babel from 'gulp-babel'
-import terser from 'gulp-terser'
-import { rollup } from 'rollup'
-import resolve from '@rollup/plugin-node-resolve'
-// import commonjs from '@rollup/plugin-commonjs'
-// eslint-disable-next-line @typescript-eslint/no-var-requires
-const commonjs = require('@rollup/plugin-commonjs')
 type Stream=NodeJS.ReadWriteStream
 const tsProject = createProject('tsconfig.json')
 const sourceGlob = 'src/lib/*'
@@ -20,81 +13,16 @@ export function buildDocs (): Stream {
       media: 'media'
     }))// For whatever reason, this doesn't work with gulp-typescript very well
 }
-export function buildEs (): Stream {
-  return src(sourceGlob)
-    .pipe(tsProject())
-    .pipe(dest('dist/lib'))
-}
-export const buildEsAndDocs = parallel(buildEs, buildDocs)
-export function buildBabel (): Stream {
-  return src('dist/lib/*.js')
-    .pipe(babel())
-    .pipe(src('dist/lib/*.d.ts'))
-    .pipe(dest('dist/babel/'))
-}
-const umdOutput = 'dist/umd/pixelmanipulator.js'
-async function rollupToUmd (): Promise<void> {
-  const bundle = await rollup({
-    input: 'dist/babel/pixelmanipulator.js',
-    external: /core-js/
-  })
-  await bundle.write({
-    file: umdOutput,
-    format: 'umd',
-    name: 'pixelmanipulator'
-  })
-  return await bundle.close()
-}
-const bundleOutput = 'dist/bundle/pixelmanipulator.js'
-async function rollupToBundle (): Promise<void> {
-  const bundle = await rollup({
-    input: 'dist/babel/pixelmanipulator.js',
-    plugins: [
-      resolve(),
-      commonjs()
-    ]
-  })
-  await bundle.write({
-    file: bundleOutput,
-    format: 'umd',
-    name: 'pixelmanipulator'
-  })
-  return await bundle.close()
-}
-const doRollup = parallel(rollupToUmd, rollupToBundle)
-function minifyUmd (): Stream {
-  return src(umdOutput)
-    .pipe(terser())
-    .pipe(dest('dist/umd/min'))
-}
-function minifyBundle (): Stream {
-  return src(bundleOutput)
-    .pipe(terser())
-    .pipe(dest('dist/bundle/min'))
-}
-const minify = parallel(minifyUmd, minifyBundle)
-function moveRollupTypes (): Stream {
-  return src('dist/babel/*.d.ts')
-    .pipe(dest('dist/umd'))
-    .pipe(dest('dist/bundle'))
-    .pipe(dest('dist/umd/min'))
-    .pipe(dest('dist/bundle/min'))
-}
-export const buildUmd = series(buildEsAndDocs, buildBabel, doRollup, minify, moveRollupTypes)
 const demoSrcGlob = 'src/demo/*.ts'
 export function demoTsc (): Stream {
   return src(demoSrcGlob)
     .pipe(tsProject())
     .pipe(dest('dist/demo'))
 }
-export const buildDemo = series(buildUmd, demoTsc)
-export const build = buildDemo
+export const build = parallel(buildDocs, demoTsc)
 export default build
 export function buildWatch (): void {
   watch([sourceGlob, 'README.md', demoSrcGlob], { ignoreInitial: false }, build)
 }
-export function buildWatchLib (): void {
-  watch([sourceGlob, 'README.md'], { ignoreInitial: false }, buildUmd)
-}
 // This is called a "modeline". It's a (n)vi(m)|ex thing.
 // vi: tabstop=2 shiftwidth=2 expandtab

package.json

@@ -4,11 +4,13 @@
   "description": "Run any cellular automata on an html5 canvas.",
   "main": "dist/umd/pixelmanipulator.js",
   "module": "dist/lib/pixelmanipulator.js",
-  "types": "dist/lib/pixelmanipulator.d.js",
+  "types": "dist/lib/pixelmanipulator.d.ts",
+  "source": "src/lib/pixelmanipulator.ts",
   "repository": "git@github.com:Lazerbeak12345/pixelmanipulator.git",
   "homepage": "https://lazerbeak12345.github.io/pixelmanipulator",
   "author": "Nathan Fritzler <nfblaster@live.com>",
   "license": "GPL-3.0-or-later",
+  "browserslist": "defaults",
   "keywords": [
     "cellular automata",
     "game of life",
@@ -37,14 +39,9 @@
     "canvas"
   ],
   "devDependencies": {
-    "@babel/core": "^7.17.5",
-    "@babel/preset-env": "^7.16.11",
-    "@rollup/plugin-commonjs": "^21.0.2",
-    "@rollup/plugin-node-resolve": "^13.1.3",
+    "@parcel/packager-ts": "2.3.2",
+    "@parcel/transformer-typescript-types": "2.3.2",
     "@types/gulp": "^4.0.9",
-    "@types/gulp-babel": "^6.1.30",
-    "@types/gulp-sourcemaps": "^0.0.35",
-    "@types/gulp-terser": "^1.2.1",
     "@types/node": "^14",
     "@typescript-eslint/eslint-plugin": "^4.0.1",
     "@typescript-eslint/parser": "^4.0.0",
@@ -55,29 +52,23 @@
     "eslint-plugin-promise": "^4.2.1 || ^5.0.0",
     "eslint-plugin-tsdoc": "^0.2.14",
     "gulp": "^4.0.2",
-    "gulp-babel": "^8.0.0",
-    "gulp-terser": "^2.1.0",
     "gulp-typedoc": "^3.0.2",
     "gulp-typescript": "^6.0.0-alpha.1",
-    "rollup": "^2.67.3",
+    "parcel": "^2.3.2",
     "ts-node": "^10.5.0",
     "typedoc": "^0.22.12",
     "typedoc-plugin-mdn-links": "^1.0.5",
     "typescript": "<4.5.0"
   },
   "scripts": {
-    "prepare": "yarn build",
     "pretest": "yarn build",
     "test": "exit 1",
-    "watch:serve": "python -m http.server",
-    "watch:build": "gulp buildWatch",
-    "watch:all": "yarn watch:serve & yarn watch:build",
-    "watch": "yarn watch:all",
+    "watch": "parcel src/demo/pixelmanipulator.html",
     "prebuild": "eslint .",
-    "build": "gulp",
+    "build": "parcel build && gulp",
     "coverage": "exit 1"
   },
   "dependencies": {
-    "core-js": "^3.21.1"
+    "@swc/helpers": "^0.2.14"
   }
 }

src/demo/index.ts

@@ -1,4 +1,4 @@
-import { PixelManipulator, Color, version } from '../lib/pixelmanipulator.js'
+import { PixelManipulator, Color, version } from '../lib/pixelmanipulator'
 
 const canvas = document.getElementById('canvas')
 

pixelmanipulator.html → src/demo/pixelmanipulator.html

@@ -21,9 +21,9 @@
 		<!--Declarations and types (media objs and favicons)-->
 		<meta charset="utf-8">
 		<title>Pixel Manipulator</title>
-		<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
+		<link rel="shortcut icon" href="../../favicon.ico" type="image/x-icon">
 		<!--CSS files-->
-		<link rel="stylesheet" type="text/css" href="src/demo/index.css"></link>
+		<link rel="stylesheet" type="text/css" href="index.css"></link>
 	</head>
 	<body>
 		<!--Content-->
@@ -151,6 +151,6 @@
 			</div>
 		</div>
 		<div id="pixelCounter" style="position:absolute; bottom:0px; text-align:left; left:0px;"></div>
-		<script type=module src="./dist/demo/index.js"></script>
+		<script type=module src="index.ts"></script>
 	</body>
 </html>