Chrome says Deprecated script, please remove

[mariusa]

Chrome gives

[ionicons] Deprecated script, please remove: <script src="https://unpkg.com/ionicons@4.5.10-0/dist/ionicons.js"></script>
To improve performance it is recommended to set the differential scripts in the head as follows:
<script type="module" src="https://unpkg.com/ionicons@4.5.10-0/dist/ionicons/ionicons.esm.js"></script>
<script nomodule="" src="https://unpkg.com/ionicons@4.5.10-0/dist/ionicons/ionicons.js"></script>

Please update usage doc to mention how to use ionicons without getting this warning. Thanks!

[HeinDiez]

the 2 different script doesn't seems to work... any idea on how to fix this?

[iBobik]

It is not message by Chrome but Ionicons itself.

[popaprozac]

<script type="module" src="https://unpkg.com/ionicons@5.0.0/dist/ionicons/ionicons.esm.js"></script> works just fine

[iBobik]

Btw, in Vue projects Ionic should not include icons like this (from CDN) because icons are compiled in by webpack.

…

18. 2. 2020 v 8:14, Zachary Botterman ***@***.***>:  <script type="module" ***@***.***/dist/ionicons/ionicons.esm.js"></script> works just fine — You are receiving this because you are subscribed to this thread. Reply to this email directly, view it on GitHub, or unsubscribe.

[carlflor]

also bumped into this in my nuxt project

[HeinDiez]

@carlflor the workaround i did to solve the problem was to npm install ionicons or react-icons

from there on you can import any icons you want to use.

[glaszig]

i'm getting the same because the included file, for whatever reason, contains the following:

(function(doc){
  var scriptElm = doc.scripts[doc.scripts.length - 1];
  var warn = ['[ionicons] Deprecated script, please remove: ' + scriptElm.outerHTML];

  warn.push('To improve performance it is recommended to set the differential scripts in the head as follows:')

  var parts = scriptElm.src.split('/');
  parts.pop();
  parts.push('ionicons');
  var url = parts.join('/');

  var scriptElm = doc.createElement('script');
  scriptElm.setAttribute('type', 'module');
  scriptElm.src = url + '/ionicons.esm.js';
  warn.push(scriptElm.outerHTML);
  scriptElm.setAttribute('data-stencil-namespace', 'ionicons');
  doc.head.appendChild(scriptElm);

  
  scriptElm = doc.createElement('script');
  scriptElm.setAttribute('nomodule', '');
  scriptElm.src = url + '/ionicons.js';
  warn.push(scriptElm.outerHTML);
  scriptElm.setAttribute('data-stencil-namespace', 'ionicons');
  doc.head.appendChild(scriptElm)
  
  console.warn(warn.join('\n'));

})(document);

which is perplexing given the instructions to simply paste <script src="https://unpkg.com/ionicons@5.1.2/dist/ionicons.js"></script> into the html.

i need to package ionicons with webpack and self-host everything and simply cannot find a way of having them work with the distributed code. i tried packaging ionicons, ionicons/dist/ionicons, ionicons/dist/cjs, ionicons/dist/esm... nothing works. the only thing that works is <script type="module" src="https://unpkg.com/ionicons@5.0.0/dist/ionicons/ionicons.esm.js"></script> which, like i said above, is no option for my case.

[liamdebeasi]

Hi everyone,

I have updated the Ionicons site to reflect the revised usage: https://ionic.io/ionicons/usage

<script type="module" src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.esm.js"></script>
<script nomodule src="https://unpkg.com/ionicons@5.5.2/dist/ionicons/ionicons.js"></script>

[andresmoraes]

This problem is caused by option 'Rocket Loader™' from Cloudflare. Switch off.