search

automerge / automerge-classic

A JSON-like data structure (a CRDT) that can be modified concurrently by different users, and merged again automatically.
http://automerge.org/
MIT License
14.76k stars 467 forks source link

How to use this in Browser. CDN Broken? #459

Closed FelixSelter closed 2 years ago

FelixSelter commented 2 years ago

I now of this:https://www.jsdelivr.com/package/npm/automerge
But if I try to include it with a script tag it tells me that require is not a function
So I tried loading this first: https://cdnjs.com/libraries/require.js Then it told me: Uncaught Error: Module name "uuid" has not been loaded yet for context: _. Use require([]) So I tried loading https://cdnjs.com/libraries/uuid at the beginning but the error remains

I also know of this:

Otherwise, clone this repository, and then you can use the following commands:

yarn install — installs dependencies.
yarn test — runs the test suite in Node.
yarn run browsertest — runs the test suite in web browsers.
yarn build — creates a bundled JS file dist/automerge.js for web browsers. It includes the dependencies and is set up so that you can load through a script tag.

But I would like to host using github pages and I cant put a file with your sourcecode in my repository. Plus the build failes

It would be nice if someone could explain me how I can load this in the browser as the following is not working:

<!DOCTYPE html>
<html lang="en">

<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/uuid/8.3.2/uuid.min.js" integrity="sha512-UNM1njAgOFUa74Z0bADwAq8gbTcqZC8Ej4xPSzpnh0l6KMevwvkBvbldF9uR++qKeJ+MOZHRjV1HZjoRvjDfNQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js" integrity="sha512-c3Nl8+7g4LMSTdrm621y7kf9v3SDPnhxLNhcjFJbKECVnmZHTdo+IRO05sNLTH/D3vA6u1X32ehoLC7WFVdheg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
    <script src="https://cdn.jsdelivr.net/npm/automerge@1.0.1-preview.6/src/automerge.min.js"></script>
</head>

</html>
FelixSelter commented 2 years ago

For now Im using https://www.jsdelivr.com/package/npm/automerge?version=1.0.1-preview.0 After this release the file contains requires

ept commented 2 years ago

Hi @FelixSelter. I think the best approach would be to use the dist/automerge.js file generated by yarn build, since it bundles the library dependencies (including uuid) into a single file. That file ought to be included in the npm releases so that jsDelivr can find it, but for some reason it seems to be missing from the last couple of releases. I will look into it when I next do a release.

FelixSelter commented 2 years ago

Thank you. awesome work

ept commented 2 years ago

Let's keep this issue open for now until we actually have it working properly with jsDelivr.

ept commented 2 years ago

Hi @FelixSelter, I've now figured out how to publish the bundled JS file to npm and jsDelivr, and you should now be able to access it like this: https://cdn.jsdelivr.net/npm/automerge@1.0.1-preview.7/dist/automerge.js

FelixSelter commented 2 years ago

Thank you