Home Explore Help
Register Sign In
oleg
/
alpine
mirror of https://github.com/alpinejs/alpine.git
1
0
Fork 0
Files Issues 0 Wiki
Browse Source

include polyfills into alpine ie11 script

Keyur Shah 5 years ago
parent
5107bdd0b8
commit
92b11f4a7d
12 changed files with 1051 additions and 318 deletions
Unified View Show Diff Stats
  1. 2 7
      README.md
  2. 0 0
      dist/alpine.js.map
  3. 0 0
      dist/alpine_ie11.js
  4. 0 0
      dist/alpine_ie11.js.map
  5. 0 0
      dist/alpine_ie11_polyfills.js
  6. 0 0
      dist/alpine_ie11_polyfills.js.map
  7. 1 8
      examples/index_ie11.html
  8. 0 136
      examples/index_ie11_event.html
  9. 951 93
      package-lock.json
  10. 43 33
      package.json
  11. 45 41
      rollup_ie11.config.js
  12. 9 0
      src/polyfills.js

+ 2 - 7
README.md
View File 

@@ -29,17 +29,12 @@ Include it in your script.
 
 import 'alpinejs'
 
 import 'alpinejs'
 
 ```
 
 ```
 
 
 
-For IE11, a different Alpine script is used and polyfills need to be provided. Please add the following scripts to the end of your `<head>`> section.
 
+**For IE11** Please use this script instead. Add the following script to the end of your `<head>`> section.
 
 ```html
 
 ```html
 
-<script src="https://polyfill.io/v3/polyfill.js?features=MutationObserver%2CArray.from%2CArray.prototype.forEach%2CMap%2CSet%2CArray.prototype.includes%2CString.prototype.includes%2CPromise%2CNodeList.prototype.forEach%2CObject.values%2CReflect%2CReflect.set%2CString.prototype.startsWith%2CArray.prototype.find%2CArray.prototype.findIndex%2CElement.prototype.closest%2CElement.prototype.remove%2CCustomEvent%2CElement.prototype.classList%2CHTMLTemplateElement"></script>
 
-<script src="https://unpkg.com/shim-selected-options"></script>
 
-<script src="https://cdn.jsdelivr.net/npm/proxy-polyfill@0.3.0/proxy.min.js"></script>
 
-
 
-<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v1.9.8/dist/alpine_ie11.js" defer></script>
 
+<script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v1.10.1/dist/alpine_ie11.js" defer></script>
 
 ```
 
 ```
 
 
 
 
 
-
 
 ## Use
 
 ## Use
 
 
 
 *Dropdown/Modal*
 
 *Dropdown/Modal*

File diff suppressed because it is too large
+ 0 - 0
dist/alpine.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/alpine_ie11.js


File diff suppressed because it is too large
+ 0 - 0
dist/alpine_ie11.js.map


File diff suppressed because it is too large
+ 0 - 0
dist/alpine_ie11_polyfills.js


File diff suppressed because it is too large
+ 0 - 0
dist/alpine_ie11_polyfills.js.map


+ 1 - 8
examples/index_ie11.html
View File 

@@ -18,14 +18,7 @@
 
             .ease-out { transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
 
             .ease-out { transition-timing-function: cubic-bezier(0, 0, 0.2, 1); }
 
     </style>
 
     </style>
 
 
 
-    <script src="https://polyfill.io/v3/polyfill.js?features=MutationObserver%2CArray.from%2CArray.prototype.forEach%2CMap%2CSet%2CArray.prototype.includes%2CString.prototype.includes%2CPromise%2CNodeList.prototype.forEach%2CObject.values%2CReflect%2CReflect.set%2CString.prototype.startsWith%2CArray.prototype.find%2CArray.prototype.findIndex%2CElement.prototype.closest%2CElement.prototype.remove%2CCustomEvent%2CElement.prototype.classList%2CHTMLTemplateElement"></script>
 
-    <script src="https://unpkg.com/shim-selected-options"></script>
 
-    <script src="https://cdn.jsdelivr.net/npm/proxy-polyfill@0.3.0/proxy.min.js"></script>
 
-
 
-    <script src="/dist/alpine-ie11.js" defer></script>
 
-    <!--
 
-    <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v0.4.0/dist/project-x.js" defer></script>
 
-    -->
 
+    <script src="/dist/alpine_ie11.js" defer></script>
 
 </head>
 
 </head>
 
 
 
 <body>
 
 <body>

+ 0 - 136
examples/index_ie11_event.html
View File 

@@ -1,136 +0,0 @@
 
-<!doctype html>
 
-<html>
 
-
 
-<head>
 
-    <meta http-equiv="X-UA-Compatible" content="IE=edge;" />
 
-
 
-    <style>
 
-        .hidden {
 
-            display: none;
 
-        }
 
-
 
-        [x-cloak] {
 
-            display: none;
 
-        }
 
-
 
-        .opacity-0 {
 
-            opacity: 0;
 
-        }
 
-
 
-        .opacity-100 {
 
-            opacity: 1;
 
-        }
 
-
 
-        .transition-slow {
 
-            transition-duration: 300ms;
 
-        }
 
-
 
-        .transition-medium {
 
-            transition-duration: 200ms;
 
-        }
 
-
 
-        .transition-faster {
 
-            transition-duration: 100ms;
 
-        }
 
-
 
-        .scale-90 {
 
-            transform: scale(0.9);
 
-        }
 
-
 
-        .scale-100 {
 
-            transform: scale(1);
 
-        }
 
-
 
-        .ease-in {
 
-            transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
 
-        }
 
-
 
-        .ease-out {
 
-            transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
 
-        }
 
-
 
-    </style>
 
-
 
-    <script
 
-        src="https://polyfill.io/v3/polyfill.min.js?features=MutationObserver%2CArray.from%2CArray.prototype.forEach%2CMap%2CSet%2CArray.prototype.includes%2CString.prototype.includes%2CPromise%2CNodeList.prototype.forEach%2CObject.values%2CReflect%2CReflect.set%2CString.prototype.startsWith%2CArray.prototype.find%2CArray.prototype.findIndex%2CElement.prototype.closest%2CElement.prototype.remove">
 
-    </script>
 
-
 
-    <script>
 
-    // source: https://developer.mozilla.org/en-US/docs/Web/API/CustomEvent/CustomEvent
 
-;(function() {
 
-  if (typeof window.CustomEvent === "function") return false
 
-
 
-  function CustomEvent(event, params) {
 
-    params = params || { bubbles: false, cancelable: false, detail: undefined }
 
-    var evt = document.createEvent("CustomEvent")
 
-    evt.initCustomEvent(event, params.bubbles, params.cancelable, params.detail)
 
-    return evt
 
-  }
 
-
 
-  CustomEvent.prototype = window.Event.prototype
 
-
 
-  window.CustomEvent = CustomEvent
 
-})()
 
-    
-    
-    </script>
 
-
 
-    <script src="https://cdn.jsdelivr.net/npm/proxy-polyfill@0.3.0/proxy.min.js"></script>
 
-
 
-    <script src="/dist/alpine-ie11.js"></script>
 
-    <!--
 
-    <script src="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v0.4.0/dist/project-x.js" defer></script>
 
-    -->
 
-</head>
 
-
 
-<body>
 
-
 
-
 
-
 
-    <h2>Dispatch 1</h2>
 
-
 
-
 
-    <div x-data="{ foo: 'bar' }" x-on:custom-event="foo = $event.detail.newValue">
 
-        <span x-text="foo"></span>
 
-
 
-        <button x-on:click="$dispatch('custom-event', {newValue: 'bazil'})">Turn 'bar' to 'baz'</button>
 
-    </div>
 
-
 
-    <h2>Dispatch 2</h2>
 
-
 
-    <div x-data="{}" x-on:custom-event="alert('hello')">
 
-        <button x-on:click="$dispatch('custom-event')">Send Alert</button>
 
-    </div>
 
-
 
-
 
-    <h2>Dispatch 3 - Listen Window Level</h2>
 
-
 
-    <div x-data="{foo: 'bar'}" x-on:custom-event-bar.window="foo = $event.detail.newValue">
 
-            <span x-text="foo"></span>
 
-    </div>
 
-
 
-    <div x-data="{}" @custom-event-bar="console.log($event.detail.newValue)">
 
-        <div @custom-event-bar="console.log($event.detail.foo)">
 
-            <button
 
-                @click="$dispatch('custom-event-bar', { foo: 'bax1', newValue: 'bax2' })">
 
-                <!-- When clicked, will console.log "bar" -->
 
-                Click
 
-            </button>
 
-        </div>
 
-    </div>
 
-
 
-    
-
 
-    <h2>Binding</h2>
 
-
 
-    <div x-data="{ foo: 'bar'}">
 
-        Text:
 
-        <span x-text="JSON.stringify(foo)"></span>
 
-        <input type="text" x-model="foo">
 
-    </div>
 
-
 
-
 
-
 
-</body>
 
-
 
-</html>

File diff suppressed because it is too large
+ 951 - 93
package-lock.json


+ 43 - 33
package.json
View File 

@@ -1,35 +1,45 @@
 
 {
 
 {
 
-  "main": "dist/alpine.js",
 
-  "name": "alpinejs",
 
-  "version": "1.10.1",
 
-  "repository": {
 
-    "type": "git",
 
-    "url": "git://github.com/alpinejs/alpine.git"
 
-  },
 
-  "scripts": {
 
-    "watch": "concurrently \"rollup -c -w\" \"npx rollup -c rollup_ie11.config.js -w\"",
 
-    "build": "concurrently \"rollup -c\" \"npx rollup -c rollup_ie11.config.js\"",
 
-    "test": "npx jest",
 
-    "test:debug": "node --inspect node_modules/.bin/jest --runInBand",
 
-    "postpublish": "PACKAGE_VERSION=$(cat package.json | grep \\\"version\\\" | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$PACKAGE_VERSION && git push --tags"
 
-  },
 
-  "author": "Caleb Porzio",
 
-  "license": "MIT",
 
-  "devDependencies": {
 
-    "@babel/core": "^7.7.7",
 
-    "@babel/preset-env": "^7.7.7",
 
-    "@testing-library/dom": "^6.11.0",
 
-    "@testing-library/jest-dom": "^4.2.4",
 
-    "babel-jest": "^24.8.0",
 
-    "concurrently": "^5.1.0",
 
-    "jest": "^24.8.0",
 
-    "jsdom-simulant": "^1.1.2",
 
-    "rollup": "^1.27.14",
 
-    "rollup-plugin-babel": "^4.3.3",
 
-    "rollup-plugin-filesize": "^6.2.1",
 
-    "rollup-plugin-node-resolve": "^5.2.0",
 
-    "rollup-plugin-strip-code": "^0.2.7",
 
-    "rollup-plugin-terser": "^5.1.3"
 
-  },
 
-  "dependencies": {}
 
+    "main": "dist/alpine.js",
 
+    "name": "alpinejs",
 
+    "version": "1.10.1",
 
+    "repository": {
 
+        "type": "git",
 
+        "url": "git://github.com/alpinejs/alpine.git"
 
+    },
 
+    "scripts": {
 
+        "watch": "concurrently \"rollup -c -w\" \"npx rollup -c rollup_ie11.config.js -w\"",
 
+        "build": "concurrently \"rollup -c\" \"npx rollup -c rollup_ie11.config.js\"",
 
+        "test": "npx jest",
 
+        "test:debug": "node --inspect node_modules/.bin/jest --runInBand",
 
+        "postpublish": "PACKAGE_VERSION=$(cat package.json | grep \\\"version\\\" | head -1 | awk -F: '{ print $2 }' | sed 's/[\",]//g' | tr -d '[[:space:]]') && git tag v$PACKAGE_VERSION && git push --tags"
 
+    },
 
+    "author": "Caleb Porzio",
 
+    "license": "MIT",
 
+    "devDependencies": {
 
+        "@babel/core": "^7.8.4",
 
+        "@babel/preset-env": "^7.8.4",
 
+        "@rollup/plugin-commonjs": "^11.0.2",
 
+        "@rollup/plugin-multi-entry": "^3.0.0",
 
+        "@testing-library/dom": "^6.12.2",
 
+        "@testing-library/jest-dom": "^4.2.4",
 
+        "@webcomponents/template": "^1.4.1",
 
+        "babel-jest": "^24.8.0",
 
+        "classlist-polyfill": "^1.2.0",
 
+        "concurrently": "^5.1.0",
 
+        "core-js": "^3.6.4",
 
+        "custom-event-polyfill": "^1.0.7",
 
+        "element-closest": "^3.0.2",
 
+        "element-remove": "^1.0.4",
 
+        "jest": "^24.8.0",
 
+        "jsdom-simulant": "^1.1.2",
 
+        "proxy-polyfill": "^0.3.0",
 
+        "rollup": "^1.31.0",
 
+        "rollup-plugin-babel": "^4.3.3",
 
+        "rollup-plugin-filesize": "^6.2.1",
 
+        "rollup-plugin-node-resolve": "^5.2.0",
 
+        "rollup-plugin-strip-code": "^0.2.7",
 
+        "rollup-plugin-terser": "^5.2.0",
 
+        "shim-selected-options": "^1.0.1"
 
+    },
 
+    "dependencies": {}
 
 }
 
 }

+ 45 - 41
rollup_ie11.config.js
View File 

@@ -1,49 +1,53 @@
 
-
 
 import babel from 'rollup-plugin-babel';
 
 import babel from 'rollup-plugin-babel';
 
 import filesize from 'rollup-plugin-filesize';
 
 import filesize from 'rollup-plugin-filesize';
 
-import { terser } from "rollup-plugin-terser";
 
+import {
 
+    terser
 
+} from "rollup-plugin-terser";
 
 import resolve from "rollup-plugin-node-resolve"
 
 import resolve from "rollup-plugin-node-resolve"
 
+import commonjs from '@rollup/plugin-commonjs'
 
+import multi from '@rollup/plugin-multi-entry';
 
 
 
 
 
 export default [{
 
 export default [{
 
-        input: 'src/index.js',
 
-        output: {
 
-            name: 'Alpine',
 
-            file: 'dist/alpine-ie11.js',
 
-            format: 'umd',
 
-            sourcemap: true,
 
-        },
 
-        plugins: [
 
-            resolve(),
 
-            filesize(),
 
-            terser({
 
-                    mangle: false,
 
-                    compress: {
 
-                        drop_debugger: false,
 
-                    }
 
-            }),
 
-            babel({
 
-                babelrc: false,
 
-                exclude: 'node_modules/**',
 
-                presets: [
 
-                    [
 
-                        "@babel/preset-env",
 
-                        {
 
-                            targets: {
 
-                                browsers: "> 0.5%, ie >= 11"
 
-                            },
 
-                            modules: false,
 
-                            spec: true,
 
-                            useBuiltIns: "usage",
 
-                            forceAllTransforms: true,
 
-                            corejs: {
 
-                                version: 3,
 
-                                proposals: false
 
-                            }
 
+    input: ['src/polyfills.js', 'src/index.js'],
 
+    output: {
 
+        name: 'Alpine',
 
+        file: 'dist/alpine_ie11.js',
 
+        format: 'umd',
 
+        sourcemap: true,
 
+    },
 
+    plugins: [
 
+        multi(),
 
+        commonjs(),
 
+        resolve(),
 
+        filesize(),
 
+        terser({
 
+            mangle: false,
 
+            compress: {
 
+                drop_debugger: false,
 
+            }
 
+        }),
 
+        babel({
 
+            babelrc: false,
 
+            exclude: 'node_modules/**',
 
+            presets: [
 
+                [
 
+                    "@babel/preset-env",
 
+                    {
 
+                        targets: {
 
+                            browsers: "> 0.5%, ie >= 11"
 
+                        },
 
+                        modules: false,
 
+                        spec: true,
 
+                        useBuiltIns: "usage",
 
+                        forceAllTransforms: true,
 
+                        corejs: {
 
+                            version: 3,
 
+                            proposals: false
 
                         }
 
                         }
 
-                    ]
 
+                    }
 
                 ]
 
                 ]
 
-            })
 
-        ]
 
-    }
 
-]
 
+            ]
 
+        })
 
+    ]
 
+}]

+ 9 - 0
src/polyfills.js
View File 

@@ -0,0 +1,9 @@
 
+// In use in the legacy build for IE11
 
+
 
+import "shim-selected-options"
 
+import "proxy-polyfill/proxy.min.js"
 
+import "element-closest/browser.js"
 
+import "element-remove"
 
+import "classlist-polyfill"
 
+import "@webcomponents/template"
 
+import "custom-event-polyfill"

Some files were not shown because too many files changed in this diff