vue项目中引入外部资源js

mounted() {

  const s = document.createElement('script')

  s.type = 'text/javascript'

  s.src = '你的需要的js文件地址'

  document.body.appendChild(s)

}

export default {

  components: {

    'remote-js': {

      render(createElement) {

        return createElement(

          'script',

          {

            attrs: {

              type: 'text/javascript',

              src: '你的需要的js文件地址',

            },

          },

        )

      },

    },

  },

}

首先申明我是window系统下Vue-cli 4.5.3版本，脚手架整体基于vue2内核。

1.正常js文件如果有使用export向外暴露对象，将js放在src/assets都是可以通过import直接引入。但有有些情况下我们需要导入第三方的js文件，例如近期我在做的阿里云点播视频上传SDK，包括最近在学习的ThreeJs，如果单单只是在public中index.html通过<script src="https://cdn.bootcss.com/three.js/92/three.js"></script>引入，是不够的还需要在具体vue页面引入：

这也是我尝试两天才成功，走了些弯路，希望帮助到有同样问题的打工人，共勉!

---