iT邦幫忙

0

請問如何在vue cli的元件中引入js檔

小弟從商科轉跑道
從認識到寫網頁程式經歷:6個月
課程:資策會-智慧人才培育系列(90天)
javascript(有上課30天)>自學vue(35天)

問題開始

如圖片 上面是無效的用法
我知道引入css檔只需要在app.vue中import就好
而main.js是引套件的部分
router是引元件來做路由
如果是js的cdn或js檔要怎麼引才會有效呢?

看更多先前的討論...收起先前的討論...
dragonH iT邦大師 1 級 ‧ 2020-01-27 01:32:55 檢舉
cdn 在 index.html 引用

local js 檔 可以在 .vue 檔 的 script block

用 import ... from ...來引用

然後基本上vue project很少再用 jquery

除非必要

slick 也有人寫成 vue 的 module

https://github.com/staskjs/vue-slick
好 謝謝
marlin12 iT邦新手 1 級 ‧ 2020-01-27 11:11:23 檢舉
@dragonH
正解,我選你[最佳解答] !
dragonH iT邦大師 1 級 ‧ 2020-01-27 14:18:19 檢舉
╰(*°▽°*)╯

2 個回答

0
Peter學程式
iT邦新手 4 級 ‧ 2020-01-26 23:36:39
最佳解答

放在index.html中的head試試看,我記得有用/images/emoticon/emoticon16.gif

我後來自己有找到也是這個答案 不過很謝謝

ofcourse448
有順利解決就好!

0
pwallace
iT邦新手 5 級 ‧ 2020-01-28 23:13:02

可以试试在 public/index.html 中引入这两个 js 文件,然后在 vue.config.js 中配置一下 webpack:

module.exports = {
  configureWebpack: {
    externals: {
      jquery: 'jQuery'
    }
  }
}

然后在需要用到的页面 import $ from 'jquery'import jQuery from 'jquery' 就可以使用 jQuery 了,可能需要留意的是 Vue 组件需要 mount 产生 DOM,利用 jQuery 等直接操作 DOM 的库的代码或者方法,要 mounted 里使用

configureWebpack: https://cli.vuejs.org/config/#configurewebpack
webpack externals: https://webpack.js.org/configuration/externals/

好 小的解決了但是大哥的方法也可以

我要發表回答

立即登入回答