vue : 引入、安装 jquery 、bootstrap
生活随笔
收集整理的這篇文章主要介紹了
vue : 引入、安装 jquery 、bootstrap
小編覺得挺不錯的,現在分享給大家,幫大家做個參考.
一、vue安裝jquery
前些天發現了一個巨牛的人工智能學習網站,通俗易懂,風趣幽默,忍不住分享一下給大家。點擊跳轉到教程。
1、新建一個vue工程。
2、在項目文件夾下,使用命令 npm install jquery --save-dev? 引入jquery。
npm install jquery --save-dev?3、在build/webpack.base.conf.js中添加如下內容:
var webpack = require('webpack') plugins: [new webpack.ProvidePlugin({$: "jquery",jQuery: "jquery"}) ],?添加完成后,文件內容如下:
'use strict' const path = require('path') const utils = require('./utils') const config = require('../config') const vueLoaderConfig = require('./vue-loader.conf') var webpack = require("webpack")function resolve (dir) {return path.join(__dirname, '..', dir) }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'),}},module: {rules: [{test: /\.vue$/,loader: 'vue-loader',options: vueLoaderConfig},{test: /\.js$/,loader: 'babel-loader',include: [resolve('src'), resolve('test')]},{test: /\.(png|jpe?g|gif|svg)(\?.*)?$/,loader: 'url-loader',options: {limit: 10000,name: utils.assetsPath('img/[name].[hash:7].[ext]')}},{test: /\.(mp4|webm|ogg|mp3|wav|flac|aac)(\?.*)?$/,loader: 'url-loader',options: {limit: 10000,name: utils.assetsPath('media/[name].[hash:7].[ext]')}},{test: /\.(woff2?|eot|ttf|otf)(\?.*)?$/,loader: 'url-loader',options: {limit: 10000,name: utils.assetsPath('fonts/[name].[hash:7].[ext]')}}]},// 增加一個pluginsplugins: [new webpack.ProvidePlugin({$: "jquery",jQuery: "jquery"})], }4、在src/main.js文件中 引入jquery
import $ from 'jquery'5、修改 xxxx .vue , 使用?jquery , 和以前寫 jsp 一樣用法 。
?
二、vue安裝Bootstrap
1、安裝bootstrap,使用命令
npm install bootstrap --save-dev2、在 package.json 文件中引入 bootstrap 這個模塊
3、在src/main.js文件中 引入jquery
import 'bootstrap/dist/css/bootstrap.min.css' import 'bootstrap/dist/js/bootstrap.min'?
轉自:https://www.cnblogs.com/hedeyong/p/7864842.html
總結
以上是生活随笔為你收集整理的vue : 引入、安装 jquery 、bootstrap的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: “ 我亦想望,如池鱼悠悠 ... “
- 下一篇: c#中通过win32API(FindWi