Initial commit

hansipete · Jan 2, 2025 · f94a501 · f94a501
commit f94a501
Show file tree

Hide file tree

Showing 11 changed files with 612 additions and 0 deletions.
diff --git a/.gitignore b/.gitignore
@@ -0,0 +1,24 @@
+# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
+
+# dependencies
+/node_modules
+/.pnp
+.pnp.js
+
+# misc
+.DS_Store
+*.pem
+
+# debug
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# local env files
+.env.local
+.env.development.local
+.env.test.local
+.env.production.local
+
+# testing
+# index.html
diff --git a/README.md b/README.md
@@ -0,0 +1,93 @@
+**--- DELETE START ---**
+
+# Alpine JS Plugin Template
+
+This is a template repository to help developers quickly build Alpine JS
+plugins.
+
+## How to Use
+
+1. Clone the repository with the "Use this template" button on GitHub
+2. Run `npm install` to install ES Build
+3. Build your plugin
+
+### Compiling
+
+To compile the code you run `npm run build` which will create two files in the
+`/dist` directory.
+
+### Testing
+
+In this template you will find a `index.html` file that you can use for testing
+how the Alpine JS plugin works.
+
+I recommend using [vercel/serve](https://www.npmjs.com/package/serve) to serve
+this file.
+
+## Things to Change
+
+- Find and replace "PLUGIN" with the name of your plugin
+- Find and replace "FILE" with the name of your compiled file
+- Find and replace "DESCRIPTION" with a description of your plugin
+- Uncomment "index.html" in the `.gitignore` file
+
+🚨 Make sure find and replace is case sensitive
+
+If you were creating a plugin called "Alpine JS CSV" you could do the following:
+
+- "PLUGIN" to "alpinejs-csv"
+- "FILE" to "csv"
+- "DESCRIPTION" to "Transform data into a CSV with Alpine JS 📈"
+
+---
+
+### License
+
+The choice of adding a license and what license is best for your project is up
+to you.
+
+[Adding a License on GitHub](https://docs.github.com/en/communities/setting-up-your-project-for-healthy-contributions/adding-a-license-to-a-repository)
+
+**--- DELETE END ---**
+
+# PLUGIN
+
+DESCRIPTION
+
+## Install
+
+### With a CDN
+
+```html
+<script defer src="https://unpkg.com/PLUGIN@latest/dist/FILE.min.js"></script>
+
+<script defer src="https://unpkg.com/[email protected]/dist/cdn.min.js"></script>
+```
+
+### With a Package Manager
+
+```shell
+yarn add -D PLUGIN
+
+npm install -D PLUGIN
+```
+
+```js
+import Alpine from 'alpinejs'
+import FILE from 'PLUGIN'
+
+Alpine.plugin(FILE)
+
+Alpine.start()
+```
+
+## Example
+
+Examples of how the plugin works.
+
+## Stats
+
+![](https://img.shields.io/bundlephobia/min/PLUGIN)
+![](https://img.shields.io/npm/v/PLUGIN)
+![](https://img.shields.io/npm/dt/PLUGIN)
+![](https://img.shields.io/github/license/markmead/PLUGIN)
diff --git a/builds/cdn.js b/builds/cdn.js
@@ -0,0 +1,3 @@
+import FILE from '../src/index.js'
+
+document.addEventListener('alpine:init', () => window.Alpine.plugin(FILE))
diff --git a/builds/module.js b/builds/module.js
@@ -0,0 +1,3 @@
+import FILE from '../src/index.js'
+
+export default FILE
diff --git a/dist/FILE.esm.js b/dist/FILE.esm.js
@@ -0,0 +1 @@
+function i(e){e.directive("[name]",(t,{value:a,modifiers:f,expression:l},{Alpine:n,effect:o,cleanup:r})=>{}),e.magic("[name]",(t,{Alpine:a})=>{})}var c=i;export{c as default};
diff --git a/dist/FILE.min.js b/dist/FILE.min.js
diff --git a/index.html b/index.html
@@ -0,0 +1,20 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Alpine JS Plugin</title>
+
+    <script src="https://cdn.tailwindcss.com"></script>
+
+    <script defer src="./dist/FILE.min.js"></script>
+
+    <script
+      defer
+      src="https://unpkg.com/[email protected]/dist/cdn.min.js"
+    ></script>
+  </head>
+
+  <body> </body>
+</html>
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import FILE from '../src/index.js'

		document.addEventListener('alpine:init', () => window.Alpine.plugin(FILE))
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,3 @@
		import FILE from '../src/index.js'

		export default FILE
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1 @@
		function i(e){e.directive("[name]",(t,{value:a,modifiers:f,expression:l},{Alpine:n,effect:o,cleanup:r})=>{}),e.magic("[name]",(t,{Alpine:a})=>{})}var c=i;export{c as default};