美文网首页
Vue-cli基础

Vue-cli基础

作者: L怪丫头 | 来源:发表于2017-11-22 19:53 被阅读0次

    安装步骤

    1、全局安装Vue-cli:

      npm install vue-cli -g

    2、查看是否安装成功:

      vue -V

    3、初始化项目:

      vue init webpack 自定义目录名称

    4、进入到第3步定义的目录: 

      cd 你的目录名称

    5、安装项目依赖插件:

      npm install

    6、启动服务器:

      npm run dev

    目录介绍

    build webpack:

      配置相关

    config webpack:

        webpack配置相关(生产环境和开发环境)

    node_moules:

    通过npm install 安装的依赖代码库

    src:

    项目源码(我们开发的所有代码都会放在src目录下)

    static:

    放第三方静态资源的

    .gitkeep:

    提交git(空文件夹是不能提交到git的,所以添加了一个.gitkeep文件)

    .babelrc:

    ES6转ES5配置文件

    .editorconfig:

      编辑器的配置

    .eslintignore:

      代码风格检测配置(忽略build和config文件夹下的js文件)

    .eslintrc.js:

      代码风格检查配置

    .gitignore:

      忽略掉提交到git的文件

    index.html:

      入口文件,css和js是会动态插入到这个页面

    main.js:

        js入口文件

    App.vue:

        整站的实例文件(可以看成是本项目的大组件或根组件)

    package.json:

        整个项目的描述及插件

    常见错误

    在大家用vue-cli创建工程的时候,会有一项,使用使用eslint,如果选择了y,那么工程就会安装并启用eslint。下面列举下常见的错误提示 :

    1、多余的分号:

    2、定义了却未使用的变量 :

    3、结尾多余空格:

    4、超过一行的空行:

    5、代码尾行应该有空行:

    相关文章

      网友评论

          本文标题:Vue-cli基础

          本文链接:https://www.haomeiwen.com/subject/gwvovxtx.html