zoukankan      html  css  js  c++  java
  • Vue 项目实战系列 (一)

      最近一直在学习Vue,基本的文档看完后就需要进行具体的项目进行练手了,本系列文章主要是将我学习过程记录下来,和大家一起学习交流。

      我在git上找到了一个淘票票的Vue项目,项目地址:

      https://github.com/canfoo/vue2.0-taopiaopiao,大家喜欢的话可以给作者点个fork。  

      看了下项目的代码,然后决定自己在山寨一下这个项目,从零开始自己搭建下。

      第一步就是开始进行项目的初始化了,这里使用了Vue的脚手架,Vue-cli进行项目的基础代码结构搭建。由于使用了vue-cli,需要先全局安装下vue-cli.

      

    npm install -g vue-cli

    安装完成后就可以进行项目搭建了,找到一个目录进行项目初始化。

    执行:

    vue init webpack mytpp

     上面的vue-router 是vue页面的路由管理。ESLink 是对代码规范性检查,不符合规范就会报错,我不太习惯使用,这里选择no,剩下两个是单元测试和自动化测试的,我不太了解,暂时也不需要使用,完成后我们便有了项目的基本目录了。

    进入目录看下项目的结构。

    build 和 config目录下都是项目的基本配置信息,我们的源码基本都在src下面,这是我们进入mytpp下面,尝试运行下代码,执行cnpm isntall (npm install 也可以,如果使用npm install 出一些错误,可以尝试下安装淘宝镜像,cnpm , cnpm 和npm 基本的使用都是相同的)。完成后执行

    npm run dev 

    稍等片刻就会在浏览器打开一个页面,

    这里说明我们的项目初始化完成了。

    本小结结束,下一节我们将继续进行我们的项目,进行具体代码的编写。

    注:本文出自博客园 https://home.cnblogs.com/u/mdengcc/ ,转载请注明出处。

  • 相关阅读:
    ASP.NET中的状态保持(转载)
    Win7系统下VS2008安装SP1补丁解决JQuery无智能提示的问题
    合并多个List<T>类型并通过LINQ按指定属性排序
    ASP.NET状态保持:ViewState
    第一部分 CLR基础:第1章 CLR的执行模型
    Oracle存储过程知识汇总
    ASP.NET中Button控件的CommandName和CommandArgument属性用法
    PL/SQL Developer使用
    ASP.NET常用代码汇总
    PL/SQL Developer中文注释乱码的解决办法
  • 原文地址:https://www.cnblogs.com/mdengcc/p/6795304.html
Copyright © 2011-2022 走看看