vue-cli脚手架创建项目

• 项目开发
  • 项目结构的搭建
    • 使用 vue-cli 来搭建项目结构
      • 以前步骤：
        • vue create project ----> default ----> 自动生成一个项目
      • 使用了最新的步骤
        • 输入node -v//检查node版本至少为4以上
        • npm config set registry http://registry.npm.taobao.org
        • npm install -g @vue/cli
        • vue create project
        • Manually select features
          • Bable
          • LESS
          • ESLinter
          • Router
          • Vuex
        • 启动项目
          • npm run serve
      • ESLinter的语法规范
        • 句末不能加分号
        • 句末不能有空格
        • 缩进使用两个空格
        • …
        • 注意点：
          • 如果语法错误太多不会解决可以使用指令：
          • npm run lint --fix 来自修复语法
            • 可以修复语法的错误
            • 无法删除冗余的变量
      • 造项目结构
        • 将所有不需要的文件删除
      • element-ui
        • 是什么：
          • 基本于 vue2.0 的 PC 端组件库，可以用来帮助我们搭建一个项目结构
        • 怎么用：
          • 下载
            • npm i element-ui -S
            • -S 将当前依赖项保存到 package.json 中
            • 将来进行 npm install 时，可以再次下载
          • 引用
            • 引入 vue
            • 引入 element-ui 的 js 文件
            • 引入 element-ui 的 css 文件
            • Vue.use(ElementUI)
          • 使用：
            • 找到自己想的组件
              • 复制结构代码
              • 复制 js 代码

2.1 搭建项目结构

• 生成项目的选项
• 其它选项
• 项目结构
• 改造项目结构
• ESLint 的语法规范
• element-ui
• 使用 git 管理项目

2.2.1 修改项目的图标

• 步骤：
  • 找到资源图片
  • 将图片放到指定的目录下
    • public ----> public
    • assets ----> assets

e1. @ 符号的作用

• vue-cli 中为我们提供的一个路径关键字
• 表示的是 src 目录
• 注意：@ 表示的 src 目录，如果在要后继续添加路径时一定要加上 '/'

e2. 使用 $refs 获取 dom 元素

• this.$refs.form
• this.$refs[‘form’]

e3. 下载第三方包的注意点

• 如果之前用的是 cnpm , 后面改为 npm 可以会造成 node_models 中包失效
  • 一旦失效，需要删除 node_models 文件夹，重新下载

e4. axios 的基本使用

• get 请求

  axios.get(url)
       .then(res => {})
       .catch(err => {})
  

• post 请求

  axios.post(url, {mobile: '', code: ''})
  	.then(res => {})
  	.catch(err => {})
  

• 通用的请求

  axios({
    url: '',// 请求的地址
    method: '', // 请求的方式
    data: {
      
    } 
  }).then(res => {})
  .catch(err => {})
  

e5. 定时器清除之后并不为空

• 定时器在赋值时，只是将定时器的标识赋值给了等号左边的变量
• 定时器被清除时，并不会清除定时器的标识