vue-cli项目常用插件及支持安装

11 篇文章 0 订阅

1、检查 node版本

node -v

2、全局安装 vue-cli

npm install -g vue-cli

或使用国内淘宝镜像

npm install -g cnpm –registry=https://registry.npm.taobao.org

cnpm install -g vue-cli

3、使用 webpack搭建

vue init webpack vue-demo

  • vue-demo即为项目名称,可自定义

  • Install vue-router     Y   安装 vue-router

  • 其他全部为   No

4、启动

npm run dev

npm start

5、访问http://localhost:8080

6、打包项目

npm run build

7、Vuex安装

npm install vuex --save

   main.js引入

import Vuex from 'vuex'

   main.js使用Vuex

Vue.use(Vuex)

8、vue-resource安装(不能与axios同用)

 npm install vue-resource --save

   main.js引入

 import VueResource from 'vue-resource'

   main.js使用Vuex

  Vue.use(VueResource)

9、axios安装

   npm install axios

   然后

   npm install --save axios vue-axios

   main.js引入 axios、vue-axios

     import axios from 'axios'

     import VueAxios from 'vue-axios'

   main.js使用axios、vue-axios

     Vue.prototype.axios = axios;

     Vue.use(VueAxios, axios);

10、安装Element-ui

   npm i element-ui -s

   main.js引入Element-ui

     import ElementUI from 'element-ui'

main.js使用ElementUI

     Vue.use(ElementUI);

11、bootstrap + jquery 安装

npm install bootstrap --save-dev

npm install jquery --save-dev 

main.js引入bootstrap、jquery

     import $ from 'jquery'

     /*Bootstrap引入*/

     import 'bootstrap/dist/css/bootstrap.min.css'

     import 'bootstrap/dist/js/bootstrap.min.js'

配置build文件webpack.base.conf.js,添加两行代码: 

const webpack = require('webpack')

module.exports = {

     //省略

     plugins: [

        new webpack.ProvidePlugin({

         $: "jquery",

         jQuery: "jquery",

         "windows.jQuery": "jquery"

         })

      ]

}

20、其他安装

采用当前项目安装(--save-dev)

npm install 插件名称@版本 --save-dev

 

  • 0
    点赞
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值