引入jQuery
1、用webstorm打开项目后,点击下方的Terminal,出现下面的界面:
在里面输入:
npm install jquery --save -dev
安装最新版的jQuery。
出现:
说明jQuery已经安装成功。
2、安装成功后,点击:build ->webpack.base.conf.js进行配置。
(1)在function resolve (dir){…}函数的上面添加:const webpack = require('webpack');
(2)在resolve: {…}的上面添加:
plugins: [
new webpack.optimize.CommonsChunkPlugin('common.js'),
new webpack.ProvidePlugin({
jQuery: "jquery",
$: "jquery"
})
],
(3)在main.js中添加:
import $ from 'jquery'
即可引用jQuery。
在使用的时候,使用方法与平时略有差异:
$(function () {
/*js代码*/
})
引入Bootstrap
在命令运行框中输入:
npm install bootstrap3 -s
出现:
表示Bootstrap安装成功。
在main.js中加入:
import 'bootstrap3/dist/css/bootstrap.css'
import 'bootstrap3/dist/js/bootstrap.js'
即可使用。
也可以是:
import 'bootstrap3/dist/css/bootstrap.min.css'
import 'bootstrap3/dist/js/bootstrap.min.js'
Vue脚手架的搭建可以参考:Vue脚手架的搭建