vue-cli3项目中引入jquery 以及如何引进bootstrap?
1、安装jquery
npm install jquery --save
2、或则在package.json中指定版本号,然后运行npm install命令
"dependencies": { "axios": "^0.18.0", "core-js": "^2.6.5", "jquery": "^3.4.1", "vue": "^2.6.10", "vue-awesome-swiper": "^3.1.3", "vue-router": "^3.0.3", "vuex": "^3.0.1" },
3、在vue.config.js里面配置
const webpack = require('webpack'); const path = require('path'); // vue.config.js module.exports = { // 选项... devServer: { port: 8089, // proxy:{ // '/': { // target: 'http://192.168.0.125:3000/', // changeOrigin: true, // pathRewrite: {} // }, // } }, configureWebpack: {//引入jquery plugins: [ new webpack.ProvidePlugin({ $:"jquery", jQuery:"jquery", "windows.jQuery":"jquery" }) ] }, }
然后在页面里就可以愉快的使用jquery了
npm install --save-dev bootstrap
在main.js中引入
import 'bootstrap/dist/css/bootstrap.min.css'; import 'bootstrap/dist/js/bootstrap.min.js';
然后运行,结果按照提示让执行这样的命令
npm install --save popper.js
然后,再运行 就能成功使用bootstrap了
- 上一篇 »如何配置vue-cli4.0?
- 下一篇 »Vue-cli3中使用TS语法示例代码