jq와 vuejs를 혼합할 수 있나요?

jq와 vuejs를 혼합할 수 있습니다. 방법: 1. npm 도구를 사용하여 jquery를 설치합니다. 2. "webpack.base.conf.js" 및 "module.exports" 파일을 구성합니다. " Import 'jquery'"는 jq를 소개하기만 하면 됩니다.

이 튜토리얼의 운영 환경: Windows 7 시스템, vue 버전 2.9.6, DELL G3 컴퓨터.

가끔 vue.js를 생각하면 자동으로 vue-cli 스캐폴딩을 사용하여 프로젝트를 구축하는 생각이 들 때가 있습니다. 하지만 때로는 비즈니스 시나리오가 vue-cli 스캐폴딩을 사용하는 데 적합하지 않은 경우에는 vue+를 jquery와 혼합하여 사용하세요. 이들 장점을 결합하면 개발 효율성이 크게 향상됩니다.

vue 프로젝트에서 jquery를 사용하는 방법

1. jquery를 설치합니다.

프로젝트 루트 디렉토리에 들어가서 npm install jquery --save를 실행하세요.npm install jquery --save

项目的package.json会自动添加依赖信息

2、webpack配置

找到项目的build目录中的webpack.base.conf.js文件，引入：var webpack = require('webpack')

然后在module.exports中添加一段代码，

resolve: {
....
},
//添加jquery
plugins: [
  new webpack.optimize.CommonsChunkPlugin('common.js'),
  new webpack.ProvidePlugin({
    jQuery: "jquery",
    $: "jquery"
  }),
],
module: {.....

3、找到项目的main.js，添加以下代码：import 'jquery'

这样使用npm run dev

프로젝트의 package.json이 자동으로 종속성 정보를 추가합니다

2 Webpack 구성

프로젝트의 빌드 디렉토리에서 webpack을 찾으세요. .base.conf.js 파일에 다음을 소개합니다: var webpack = require('webpack')

그런 다음 module.exports에 코드 조각을 추가합니다. 🎜

<el-row id="form">....
jqueryTest(){
 console.log($("form"))
}

🎜3. 프로젝트에 다음 코드를 추가하세요: import 'jquery'🎜🎜npm run dev를 사용하여 프로젝트를 다시 실행하세요🎜🎜테스트, 개인 테스트가 성공했습니다🎜rrreee🎜 관련 추천: "🎜vue.js Tutorial🎜》🎜

위 내용은 jq와 vuejs를 혼합할 수 있나요?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!