前端之Vue：Vue-CLI 项目搭建、目录介绍、组件介绍、vue-router的使用、新建组件和使用、 js导入导出语法、前端代理、elementui的使用、第三方插件、第三方UI框架

一、 单文件组件

https://cn.vuejs.org/v2/guide/single-file-components.html#ad

二、 Vue-CLI 搭建vue项目

- 安装nodejs（安装解释器）
官网下载安装包，傻瓜式安装：https://nodejs.org/zh-cn/

	node：就是python命令
    npm：就是python的pip命令，npm下载模块慢，我们使用cnpm下载
    cnpm:阿里提供的

- 安装cnpm
npm install -g cnpm --registry=https://registry.npm.taobao.org

- 安装vue脚手架
cnpm install -g @vue/cli
	多出vue命令

- 创建项目
vue create my-project 创建出一个vue项目，等同于djagnoadmin createproject 名字
# OR
    vue ui  使用图形界面创建vue项目
   
- 开发
	-使用pycharm开发vue项目
    -装vue插件
    
- 运行起项目
	-terminal中：npm run serve
	// 要提前进入项目根目录


- 打包项目
	npm run build
	// 要在项目根目录下进行打包操作

三、 vue项目目录介绍

myfirstvue  # 项目名
	-node_modules # 该项目所有的依赖，如果要把项目给别人，这个文件夹要删掉（很大）
    -public # 文件夹
        -favicon.ico #小图标
        -index.html  # 整个vue项目的index.html,单页面开发
        
    -src    # 核心
        -store # 如果装了vuex，就会有这个文件夹
        -router #如果装了vue router ，就会有这个文件夹
        -assets # 存放资源文件（js，css，img）
        -components