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封装数字框组件实现流程，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习吧2023-04-04
这篇文章主要介绍了vue自定义指令directive的相关资料，下面通过实例给大家介绍,需要的朋友可以参考下2018-01-01
vite打包出现 "default" is not exported by "
这篇文章主要给大家介绍了关于vite打包出现 "default" is not exported by "node_modules/...问题的解决办法,文中通过代码将解决的办法介绍的非常详细,对同样遇到这个问题的朋友具有一定的参考借鉴价值,需要的朋友可以参考下2024-06-06
这篇文章主要为大家详细介绍了vue3.0实现复选框组件的封装代码，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-09-09
这篇文章主要介绍了vuepress实现自定义首页的样式风格，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-08-08
这篇文章主要介绍了vue实现导出Word文件(数据流方式)，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-06-06
这篇文章主要介绍了Vue 实例中使用$refs的注意事项，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2021-01-01
这篇文章主要介绍了element 实现导航栏收起展开功能，实现思路先给 el-menu加上 :collapse="isCollapse" 属性，这个属性也是 element 上的一个参数，意思为是否开启折叠动画，在 data 中定义 isCollapse ，用 true 和 false 控制展开与收起，需要的朋友可以参考下2023-01-01
Vue3 中一个组件从创建到挂在,会经过3个重点步骤：创建组件实例,设置组件实例,创建并执行带副作用的渲染函数,本文将着重讲清 创建组件实例、设置组件实例 这两个过程都做了什么,这部分逻辑很简单,但你会从中学习到 Vue 优秀的实践技巧,需要的朋友可以参考下2024-07-07
electron踩坑之remote of undefined的解决
这篇文章主要介绍了electron踩坑之remote of undefined的解决，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧2020-10-10
最新评论