vue基础六

vuecli

脚手架：搭建 vue 单页面应用的 环境

安装

npm i -g @vue/cli

初始化项目

vue create appName
vue ui

目录结构

pulic   
	静态资源目录   静态资源放在public 不会被webpack 处理 最终build 时，不会做任何处理
src
	assets  静态资源  会被webpack处理 css js xx 会自动扔进 dist css目录 js目录 images目录 重新命名
	components 放 公共的组件
	views  路由组件
	router 
		index.js  路由的配置文件
	App.vue 唯一 根组件  router-view 定义路由出口
	main.js 项目唯一的入口文件 所有的代码 最终都在这个js上，如果在main.js中引入资源 就是全局

模块化

使用是es6模块化
1，一个文件就是一个模块
	import "../assets/css/reset.css"
2,提供接口
	export {
		a:11,
		b:xxx
	}
	
	引入
	import { a , b } from '路径'
	import * as xxxx from "xxxx"   
	
	export default 文件(函数、对象、变量)  一个文件只能提供一个接口
	
	import 名字 from 'xxx'
	
	vue import @别名 是指src目录的绝对路径
 

单文件组件

<