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 相关文章推荐
javascript 数组操作详解
Jan 29 Javascript
JS点击链接后慢慢展开隐藏着图片的方法
Feb 17 Javascript
jQuery实现网页顶部固定导航效果代码
Dec 24 Javascript
JQ选择器_选择同类元素的第N个子元素的实现方法
Sep 08 Javascript
如何使用bootstrap框架 bootstrap入门必看!
Apr 13 Javascript
mongoose更新对象的两种方法示例比较
Dec 19 Javascript
vue-router配合ElementUI实现导航的实例
Feb 11 Javascript
详解vue axios二次封装
Jul 22 Javascript
js实现倒计时器自定义时间和暂停
Feb 25 Javascript
详解jQuery中的prop()使用方法
Jan 05 jQuery
js 闭包深入理解与实例分析
Mar 19 Javascript
微信小程序反编译的实现
Dec 10 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实现伪静态方法汇总
2016/01/13 PHP
yii2高级应用之自定义组件实现全局使用图片上传功能的方法
2016/10/08 PHP
PHP 实现重载
2021/03/09 PHP
QQ邮箱的一个文本编辑器代码
2007/03/14 Javascript
js实现图片旋转的三种方法
2014/04/10 Javascript
jQuery中height()方法用法实例
2014/12/24 Javascript
JavaScript实现防止网页被嵌入Frame框架的代码分享
2014/12/29 Javascript
AngularJs ng-route路由详解及实例代码
2016/09/14 Javascript
Node.js下自定义错误类型详解
2016/10/17 Javascript
纯js仿淘宝京东商品放大镜功能
2017/03/02 Javascript
微信小程序教程系列之新建页面(4)
2017/04/17 Javascript
JS实现颜色的10进制转化成rgba格式的方法
2017/09/04 Javascript
vue做移动端适配最佳解决方案(亲测有效)
2018/09/04 Javascript
用python分割TXT文件成4K的TXT文件
2009/05/23 Python
python获取当前时间对应unix时间戳的方法
2015/05/15 Python
python 通过麦克风录音 生成wav文件的方法
2019/01/09 Python
python如何将多个PDF进行合并
2019/08/13 Python
python类的实例化问题解决
2019/08/31 Python
Python字符串格式化常用手段及注意事项
2020/06/17 Python
如何利用python正则表达式匹配版本信息
2020/12/09 Python
image-set实现Retina屏幕下图片显示详细介绍
2012/12/24 HTML / CSS
css3 利用transform打造走动的2D时钟
2020/10/20 HTML / CSS
HTML5 拖拽批量上传文件的示例代码
2018/03/28 HTML / CSS
HTML5中Canvas与SVG的画图原理比较
2013/01/16 HTML / CSS
HTML5资源预加载(Link prefetch)详细介绍(给你的网页加速)
2014/05/07 HTML / CSS
一些常用的HTML5模式(pattern) 总结
2015/07/14 HTML / CSS
自主招生自荐信范文
2013/12/04 职场文书
员工晚婚的请假条
2014/02/08 职场文书
毕业大学生自荐信
2014/06/17 职场文书
店铺转让协议书(2014版)
2014/09/23 职场文书
2015年班级工作总结范文
2015/04/03 职场文书
王亚平太空授课观后感
2015/06/12 职场文书
2016年校长新年寄语
2015/08/17 职场文书
如何利用JavaScript实现二叉搜索树
2021/04/02 Javascript
基于Python实现西西成语接龙小助手
2022/08/05 Golang
MySql按时,天,周,月进行数据统计
2022/08/14 MySQL