Como o Vue importa arquivos JS/css remotos

Como o Vue importa arquivos JS/css remotos

  • Cenário do aplicativo: Por exemplo, se você deseja usar o ícone do vetor Alibaba sozinho em um determinado projeto, mas não deseja baixá-lo, mas deseja usar recursos externos (cdn ... etc.) diretamente e a importação é não permitido, então você pode usar este método! (O método é bom para gravar uma vez)

Use o método createElement do Vue:

export default {
  components: {
    "remote-css": {
      render(createElement) {
        return createElement("link", {
          attrs: { rel: "stylesheet", href: this.href },
        });
      },
      props: {
        href: { type: String, required: true },
      },
    },
    "remote-js": {
      render(createElement) {
        return createElement("script", {
          attrs: { type: "text/javascript", src: this.src },
        });
      },
      props: {
        src: { type: String, required: true },
      }
    }
  }
}

  • É realizado encapsulando um componente remote-js.
    Depois é só chamar direto na página O(∩_∩)O
<remote-css href="https://at.alicdn.com/t/font_2307826_i7ewj7yiv2k.css"></remote-css>
<remote-js src="https://at.alicdn.com/t/font_2307682_is3un805urb.js"></remote-js>

おすすめ

転載: blog.csdn.net/qq_43531694/article/details/112470680