Vue 시리즈 - vue 프로젝트에서 jQuery 및 타사 플러그인 사용

요즘 Vue를 배워요.js는 백엔드 관리 시스템을 만들고 vue-cli 비계를 이용하여 구축하고 Element을 UI 프레임워크로 한다.그리고 프로젝트에서 스크롤 바를 사용자 정의하고 브라우저의 원본 스크롤 바를 버리고 성숙한 기존 플러그인도 jQuery만 찾았기 때문에 jQuery를 도입해야 한다. 다음은 jQuery의 도입과 제3자 플러그인의 도입을 소개한다.
jQuery 도입
npm 설치 의존 도입
1. 설치

```
npm install jquery -S
```

2. 웹팩 프로필 수정
build/webpack.base.conf.js

...
var webpack = require("webpack") // 1.      webpack，     

module.exports = {
  ...
  resolve: {
    extensions: ['.js', '.vue', '.json'],
    modules: [
      resolve('src'),
      resolve('node_modules')
    ],
    alias: {
      'vue$': 'vue/dist/vue.common.js',
      'src': resolve('src'),
      'assets': resolve('src/assets'),
      'components': resolve('src/components'),
      // 2.          
      'jquery': 'jquery' 
    }
  },
  plugins: [
    // 3.        jquery
    new webpack.ProvidePlugin({
        $: "jquery",
        jQuery: "jquery",
        jquery: "jquery",
        "window.jQuery": "jquery"
    })
  ]
}

수동으로 로드
jquery를 static 디렉터리에 수동으로 다운로드합니다. 예를 들어 static/js/jquery.min.jsnpm와 달리 두 번째 단계에서 별명과 플러그인 위치를 정의합니다.

alias: {
    'vue$': 'vue/dist/vue.common.js',
    'src': resolve('src'),
    'assets': resolve('src/assets'),
    'components': resolve('src/components'),
    // 2.          
    "jquery": path.resolve(__dirname, '../static/js/jquery.min.js') 
}

jquery 제3자 플러그인 도입
npm에 설치할 수 있는 플러그인
이런 제3자 플러그인을 도입하는 방법은 이전 절의echarts를 도입하는 방법과 같다
수동 도입
미완성 미속...

이 내용에 흥미가 있습니까?

현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:

로컬 스토리지 모니터링 - 실시간 데이터 업데이트

텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.

CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.

Vue 시리즈 - vue 프로젝트에서 jQuery 및 타사 플러그인 사용

좋은 웹페이지 즐겨찾기