Vue脚手架,element ui

1、脚手架用途

脚手架用于快速生成Vue项目基础架构

脚手架安装步骤

安装3.x版本的Vue脚手架:
npm install -g @vue/cli

脚手架基本用法

三种方法
1、基于 交互式命令行 的方式,创建新版vue项目
vue create my-project
2.基于 图形化界面 的方式,创建新版vue项目
vue cli
3.基于2.x旧模板,创建旧版vue项目
npm install -g @vue/cli-init
vue init webpack my-project

vue 脚手架自定义配置

1、通过package.json配置项目
  //必须符合规范json语法 运行npm run server自动打开浏览器 再重新启动服务器
"vue":{
	"devServer":{
	"port":"8888",
	"open":"true"
	}
}
注意:不推荐这种配置方法,因为package.json主要是用来管理包的配置信息;为了方便维护,推荐将vue脚手架先关的配置,单独定义到vue.config.js配置文件中

2、通过单独配置文件配置项目
 	
	 1. 在项目的根目录创建文件vue.config.js
	 2. 在该文件中进行相关配置,从而覆盖默认配置
	 	//vue.config.js中
	 	moudle.export={
	 	deveServer:{
	 	//自动打开浏览器
	 	open:true,
	 	port:8888
	 	}
	 	}

element ui 的基本使用

1.基于命令行方式手动安装
 1. 安装依赖包npm i element-ui -S
 2. 导入Element-UI相关资源
 	//导入组件库
 	import ElementUI form 'element-ui';
 	//导入组件相关样式
 	import 'element-ui/lib/theme-chalk/index.css';
 	//配置vue插件
 	Vue.use(ElementUI);
 	
2.基于图形化界面自动安装
	
 1. 运行vue ui 命令,打开图形化界面
 2. 通过Vue项目管理器,进入具体的项目配置面板
 3. 点击插件->添加插件,进入插件查询面板
 4. 搜索vue-cli-plugin-element并安装
 5. 配置插件,实现按需导入,从而减少打包后项目的体积

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值