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

modify README for polyfill modifications and IE11 specific build script

Keyur Shah 5 years ago
parent
dbbbd39aa7
commit
d99fa19cd8
2 changed files with 11 additions and 7 deletions
Unified View Show Diff Stats
  1. 7 3
      README.md
  2. 4 4
      examples/index_ie11.html

+ 7 - 3
README.md
View File 

@@ -29,13 +29,17 @@ Include it in your script.
 
 import 'alpinejs'
 
 import 'alpinejs'
 
 ```
 
 ```
 
 
 
-For IE11, polyfills will need to be provided. Please load the following scripts before the Alpine script above.
 
+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.
 
 ```html
 
 ```html
 
-<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"></script>
 
-
 
+<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/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>
 
 ```
 
 ```
 
 
 
+
 
+
 
 ## Use
 
 ## Use
 
 
 
 *Dropdown/Modal*
 
 *Dropdown/Modal*

+ 4 - 4
examples/index_ie11.html
View File 

@@ -19,10 +19,10 @@
 
     </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://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" async></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/npm/proxy-polyfill@0.3.0/proxy.min.js"></script>
 
 
 
-    <script src="/dist/alpine-ie11.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="https://cdn.jsdelivr.net/gh/alpinejs/alpine@v0.4.0/dist/project-x.js" defer></script>
 
     -->
 
     -->
 
@@ -38,7 +38,7 @@
 
         </thead>
 
         </thead>
 
         <tbody>
 
         <tbody>
 
             <tr>
 
             <tr>
 
-                <td>Simple x-if (not working in IE11)</td>
 
+                <td>Simple x-if</td>
 
                 <td>
 
                 <td>
 
                     <div x-data="{ show: false }">
 
                     <div x-data="{ show: false }">
 
                         <template x-if="show">
 
                         <template x-if="show">
 
@@ -272,7 +272,7 @@
 
             </tr>
 
             </tr>
 
 
 
             <tr>
 
             <tr>
 
-                <td>Transitions (with x-if) (not working in IE11)</td>
 
+                <td>Transitions (with x-if)</td>
 
                 <td>
 
                 <td>
 
                     <div x-data="{ open: false }">
 
                     <div x-data="{ open: false }">
 
                         <button x-on:click="open= ! open">
 
                         <button x-on:click="open= ! open">