• vue-cli起项目步骤


    1.全局安装 vue-cli

    老版本:npm install -g vue-cli  (npm uninstall vue-cli -g 卸载)

    新版本:npm install -g @vue/cli

    安装淘宝cnpm镜像

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

    2.创建一个基于webpack模板的新项目

    老版本:vue init webpack my-blog

    新版本:vue create ele-app

    3.一路No 

    4.cd my-blog

    5.npm run dev(npm run serve)

    安装axios

    npm install --save axios 

    安装vuex

    npm install vuex --save

    安装路由 

    npm install vue-router --save

    安装better-scroll(移动端滚动)

    npm install better-scroll --save / cnpm i -S better-scroll

    安装element-UI

    npm i element-ui -S

    安装mint-UI

    npm install mint-ui -S

    一、 安装 node.js

    安装完成后,可以命令行工具中输入 node -v 和 npm -v,如果能显示出版本号,就说明安装成功。

    二、安装webpack

    npm install webpack -g

    安装完成后使用webpack -v,如果出现相应的版本号,则说明安装成功。

    三、安装 vue-cli

    npm install -g vue-cli

    安装完成后,可以使用 vue -V (注意 V 大写)查看是否安装成功。

    如果提示“无法识别 'vue' ” ,有可能是 npm 版本过低,可以使用 npm install -g npm 来更新版本

    四、使用vue-cli来构建项目

      1、在硬盘中找一个放项目的文件夹

      2、在文件夹下打开命令盘,输入命令

      Vue-Project是我们自己设置的项目名称,项目名称不能用中文

    vue init webpack Vue-Project

      3、进入项目工程目录

      4、安装项目所需依赖  npm install

      5、安装 vue 路由模块 vue-router 和网络请求模块 vue-resource

    npm install vue-router vue-resource --save

    创建完成的项目目录,如下图

    各个目录的作用

    最后一步启动项目

    npm run dev

    启动成功,打开浏览器8080窗口,页面如图所示

    活到老,学到老。 踏实+激情+坚持
  • 相关阅读:
    native2ascii转码工具的使用
    文件查找工具Everything小工具的使用
    sql中decode()重要函数使用
    java中随机生成汉字
    java中Random(long seed)方法与rRandom()方法的使用产生随机数
    WEB项目web.xml文件中classpath: 跟classpath*:使用的区别
    170809、 把list集合中的数据按照一定数量分组
    170808、生成为CVS文件
    170807、intellij idea maven集成lombok实例
    170804、使用Joda-Time优雅的处理日期时间
  • 原文地址:https://www.cnblogs.com/andyZhang0511/p/10935259.html
Copyright © 2020-2023  润新知