zoukankan      html  css  js  c++  java
  • vue

    以前很拒绝vue+jq一起使用。但是vue写动画特效实在是难受,所以就试着去尝试了下,vue+jq的开发。

    嗯,挺爽的,哈哈。

    这里讲下,如何在vue-cli中引入jquery。

    1.找到package.json文件,打开

     "dependencies": {
        "vue": "^2.5.2",
        "vue-router": "^3.0.1",
        "jquery": "^3.1.1"   // 加入此行,版本号可自己定义
      },

    2.找到webpack.base.conf.js文件,打开

    const path = require('path')
    const utils = require('./utils')
    const config = require('../config')
    const webpack = require("webpack")  //加入此行
    const vueLoaderConfig = require('./vue-loader.conf')

    3.在webpack.base.conf.js 文件中,加入

    module.exports = {
      context: path.resolve(__dirname, '../'),
      entry: {
        app: './src/main.js'
      },
      output: {
        path: config.build.assetsRoot,
        filename: '[name].js',
        publicPath: process.env.NODE_ENV === 'production'
          ? config.build.assetsPublicPath
          : config.dev.assetsPublicPath
      },
      resolve: {
        extensions: ['.js', '.vue', '.json'],
        alias: {
          'vue$': 'vue/dist/vue.esm.js',
          '@': resolve('src'),
        }
      },
     // 加入以下代码 plugins: [ new webpack.optimize.CommonsChunkPlugin('common.js'), new webpack.ProvidePlugin({ jQuery: "jquery", $: "jquery" }) ],

    4.找到main.js 打开

    import Vue from 'vue'
    import App from './App'
    import router from './router'
    import $ from 'jquery'  // 加入此行

    好了,大功告成。

    npm run dev 走一波!!!

  • 相关阅读:
    javascript 犀牛书
    Hmtl/css
    SQL Server 查询中使用Union或Union All后Order by排序无效(嵌套查询乱序)
    CSS 动画
    CSS 文字排版
    CSS 太极图
    Amazon Products 服务费估算
    CSS3 结构伪类选择器
    JS 执行机制
    vue 生命周期函数的学习
  • 原文地址:https://www.cnblogs.com/lafitewu/p/8567106.html
Copyright © 2011-2022 走看看