vue项目中如何引用第三方库(比如jQuery)
vue项目中如何引用第三方库(比如jQuery)
(1)绝对路径直接引入
在index.html 中用script 引入
<script src="./static/jquery-1.12.4.js"></script>
然后在webpack 中配置external
externals: { 'jquery': 'jQuery' }
在组件中使用时import
import $ from 'jquery'
(2)在webpack 中配置alias
resolve: { extensions: ['.js', '.vue', '.json'], alias: { '@': resolve('src'), 'jquery': resolve('static/jquery-1.12.4.js') } }
然后在组件中import
(3)在webpack 中配置plugins
plugins: [ new webpack.ProvidePlugin({ $: 'jquery' }) ]
全局使用,但在使用 eslint 情况下会报错,需要在使用了$ 的代码前添加 /*eslint-disable*/
来去掉ESLint 的检查。
Vue.js 文章被收录于专栏
Vue.js