Vue3.0结合bootstrap创建多页面应用


Posted in Javascript onMay 28, 2019

本人主要做c#winform应用,刚接触vue,发现用vue做单页面应用的比较多,多页面的资料很少,特别是用vue3.0版本做多页面的资料,更少,所以自己整理一下,结合bootstrap和jquery,也可以给有需要的同行做个参考。

1.首先用 vue --version 命令查一下安装的vue-cli版本,要3.x版本,我原先装的是2.9.6版本的

Vue3.0结合bootstrap创建多页面应用

2.卸载vue-cli,执行命令:cnpm uninstall -g vue-clinpm uninstall -g vue-cli ,执行完就好了

3.安装vue-cli3.x版本:cnpm install -g @vue/cli

Vue3.0结合bootstrap创建多页面应用

4.安装完毕后,查看一下版本:默认装的最新版,3.8.2

Vue3.0结合bootstrap创建多页面应用

5.切换到你的项目文件夹,准备创建项目吧,cmd命令操作就好了

Vue3.0结合bootstrap创建多页面应用

6.执行 vue create <项目名称>创建项目吧,我这里直接用j做测试好了

Vue3.0结合bootstrap创建多页面应用

7.新版的项目创建,会有选项可以配置,这里就不做赘述,百度有哈,一路默认回车也可以

Vue3.0结合bootstrap创建多页面应用

从别人那里看到的配置图,可以参考:

Vue3.0结合bootstrap创建多页面应用

8.项目安装完了会有如下提示

Vue3.0结合bootstrap创建多页面应用

9.执行cd j跳转到项目路径内

10.执行 npm run serve命令,即可启动服务

Vue3.0结合bootstrap创建多页面应用

可以看到有两个地址,第一个是用于本地测试,第二个是用于局域网测试,复制其中一个到浏览器运行即可。

Vue3.0结合bootstrap创建多页面应用

总结

以上所述是小编给大家介绍的Vue3.0结合bootstrap创建多页面应用,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jquery last-child 列表最后一项的样式
Jan 22 Javascript
javascript实现div的拖动并调整大小类似qq空间个性编辑模块
Dec 12 Javascript
JavaScript改变HTML元素的样式改变CSS及元素属性
Nov 12 Javascript
javascript Event对象详解及使用示例
Nov 22 Javascript
Jquery幻灯片特效代码分享--鼠标点击按钮时切换(1)
Aug 15 Javascript
jquery实现图片放大镜功能
Nov 23 Javascript
理解Javascript的call、apply
Dec 16 Javascript
JS控制静态页面之间传递参数获取参数并应用的简单实例
Aug 10 Javascript
JavaScript显式数据类型转换详解
Mar 18 Javascript
学习node.js 断言的使用详解
Mar 18 Javascript
React学习之受控组件与数据共享实例分析
Jan 06 Javascript
mpvue 项目初始化及实现授权登录的实现方法
Jul 20 Javascript
Vue实现搜索结果高亮显示关键字
May 28 #Javascript
Vue2.x通用编辑组件的封装及应用详解
May 28 #Javascript
JS拖动选择table里的单元格完整实例【基于jQuery】
May 28 #jQuery
小程序多图列表实现性能优化的方法步骤
May 28 #Javascript
实例详解带参数的 npm script
May 28 #Javascript
jquery实现Ajax请求的几种常见方式总结
May 28 #jQuery
Vue2.x通用条件搜索组件的封装及应用详解
May 28 #Javascript
You might like
php递归获取目录内文件(包含子目录)封装类分享
2013/12/25 PHP
php中HTTP_REFERER函数用法实例
2014/11/21 PHP
php自定义类fsocket模拟post或get请求的方法
2015/07/31 PHP
PHP针对多用户实现更换头像功能
2016/09/04 PHP
PHP5中使用mysqli的prepare操作数据库的介绍
2019/03/18 PHP
jquery方法+js一般方法+js面向对象方法实现拖拽效果
2012/08/30 Javascript
Javascript中匿名函数的多种调用方式总结
2013/12/06 Javascript
使用js完成节点的增删改复制等的操作
2014/01/02 Javascript
js实现鼠标移到链接文字弹出一个提示层的方法
2015/05/11 Javascript
js实现的万能flv网页播放器代码
2016/04/30 Javascript
JS获取元素多层嵌套思路详解
2016/05/16 Javascript
浅谈js的ajax的异步和同步请求的问题
2016/10/07 Javascript
jQuery给指定的table动态添加删除行的操作方法
2016/10/12 Javascript
学习使用Bootstrap栅格系统
2017/05/11 Javascript
NodeJS自定义模块写法(详解)
2017/06/27 NodeJs
浅谈Node.js ORM框架Sequlize之表间关系
2017/07/24 Javascript
node中间层实现文件上传功能
2018/06/11 Javascript
浅谈vuex actions和mutation的异曲同工
2018/12/13 Javascript
微信小程序的授权实现过程解析
2019/08/02 Javascript
javascript实现blob加密视频源地址的方法
2019/08/08 Javascript
使用preload预加载页面资源时注意事项
2020/02/03 Javascript
jQuery操作选中select下拉框的值代码实例
2020/02/07 jQuery
浅谈js中的attributes和Attribute的用法与区别
2020/07/16 Javascript
[54:09]RNG vs Liquid 2019国际邀请赛淘汰赛 败者组 BO3 第一场 8.23
2019/09/05 DOTA
python登陆asp网站页面的实现代码
2015/01/14 Python
Python实现的网页截图功能【PyQt4与selenium组件】
2018/07/12 Python
django将网络中的图片,保存成model中的ImageField的实例
2019/08/07 Python
解决Python计算矩阵乘向量,矩阵乘实数的一些小错误
2019/08/26 Python
python实现简易学生信息管理系统
2020/04/05 Python
解决reload(sys)后print失效的问题
2020/04/25 Python
Python基于xlutils修改表格内容过程解析
2020/07/28 Python
CSS3 text shadow字体阴影效果
2016/01/08 HTML / CSS
英国百年闻名的优质健康产品连锁店:Holland & Barrett
2019/12/19 全球购物
大学生找工作求职信
2014/07/09 职场文书
运输企业安全生产责任书
2014/07/28 职场文书
从严治党主题教育活动总结
2015/05/07 职场文书