vue-cli脚手架搭建方式(vue脚手架方式搭建)
更新时间：2023年04月17日 11:28:11 作者：小斯要觉觉
这篇文章主要介绍了vue-cli(vue脚手架方式搭建),本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友可以参考下
1.首先安装node前端环境,可以帮助我们去下载其他的组件
下载完成后,去自己的电脑找到node的文件路径,复制去配置环境变量,在path中配
环境搭配完成后,在cmd中进行测试 ,输入一下两个命令进行测试
2.在hbuilderX中创建一个vue-cli项目(标准的前段项目)
3.组件路由
(1)安装
vue-router 是一个插件包，所以我们还是需要用 npm 来进行安装的。 打开命令行工具，进入你的项目目录，输入下面命令。
npm i vue-router@3.5.3
(2) 第一步:
在src中创建一个文件夹router,并在该文件夹中建index.js,导入Vue,router和其他组件
格式(import Vue from"vue"),其中router和ElementUI需要Vue.use(router)
var rout = new router({
routes:[
{
path:'/login',
name:'Login',
component:Login
},
{
path:'/main',
name:'Main',
component:Main
}
]
});第二步:定义组件路由
export default rout;
第三步:导出路由对象
export default rout;
在默认的App.vue中
4.使用
5.打包
npm run build
ElementUI前端框架
1.安装,在终端输入命令npm i element-ui -S
2.在main.js中导入ElementUI框架
import ElementUI from 'element-ui'; import 'element-ui/lib/theme-chalk/index.css'; Vue.use(ElementUI)
到此这篇关于vue-cli(vue脚手架方式搭建)的文章就介绍到这了,更多相关vue-cli脚手架搭建内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
今天小编就为大家分享一篇vue改变循环遍历后的数据实例，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2019-11-11
这篇文章主要介绍了vue下载excel的实现代码,后台用post方法，本文通过实例代码给大家介绍的非常详细，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-05-05
这篇文章主要给大家介绍了关于vue3+vite+vant4手机端项目实战的相关资料,Vue3是一种前端开发框架,它的目标是提供更好的性能和开发体验,需要的朋友可以参考下2023-08-08
今天小编就为大家分享一篇默认浏览器设置及vue自动打开页面的方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
下面小编就为大家分享一篇Vue.js 动态为img的src赋值方法，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-03-03
vue elementUI select下拉框设置默认值(赋值)失败的解决
这篇文章主要介绍了vue elementUI select下拉框设置默认值(赋值)失败的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教2023-10-10
这篇文章主要介绍了Vue中的文字换行问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-09-09
本篇文章主要介绍了Vue.js 2.0 如何使用axios，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-04-04
本篇文章主要介绍了详解vuejs几种不同组件（页面）间传值的方式，具有一定的参考价值，有兴趣的可以了解一下2017-06-06
这篇文章主要介绍了详解nginx配置vue h5 history去除#号，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-11-11
最新评论