美文网首页
搭建vue环境

搭建vue环境

作者: imTinaz | 来源:发表于2018-11-07 17:25 被阅读0次

    第一步:node环境安装

    1.如果本机没有安装node运行环境,请下载node 安装包进行安装
    2.如果本机已经安装node运行环境,请更新至最新的node 版本
    下载地址:https://nodejs.org/en/ 或者 http://nodejs.cn/

    第二步:node环境检测

    为了快乐的使用命令行,我们推荐使用 gitbas
    1.下载git 并安装
    下载地址 https://git-for-windows.githu...
    安装成功后 右键菜
    [图片]
    我们可以看到 Gti Bash Here 。说明我们已经安装成功git

    1. 检测node 是否安装成功
      右键空白,选择 Gti Bash Here 弹出


      微信截图_20181107173159.png
    2. 在终端输入 node -v 如果输出版本号,说明我们安装node 环境成功,顺便输入 npm -v 查看npm版本号


      微信截图_20181107173434.png

    第三步 vue-cli脚手架安装

    1.如果访问外网比较慢,可以使用淘宝的镜像 https://npm.taobao.org/
    打开命令终端 npm install -g cnpm --registry=https://registry.npm.taobao.org
    回车之后,我就可以可以快乐的用 cnpm 替代 npm

    001.png
    看到这样
    微信截图_20181107173743.png
    恭喜你,你已经成功安装了 cnpm
    但是此后,我们还是使用 npm 来运行命令
    1. 接下来就是重点了 安装vue-cli
      npm install vue-cli -g


      微信截图_20181107173918.png

      如果你很幸运,那么接下来就是这样的


      微信截图_20181107173948.png
      我们成功了
    2. 进入我们的项目目录,右键 Gti Bash Here
    3. 初始化项目 vue init webpack supplychain_system


      微信截图_20181107174150.png

      一直回车


      image.png
      只有 vue-router 和 esline 选择yes
      image.png

      ctrl+c结束

    4. 进入 cd supplychain_system
    5. 执行 npm install
    6. 接下来执行 npm run dev


      image.png

      浏览器会自动打开


      image.png

    参考 :https://segmentfault.com/a/1190000008922234

    相关文章

      网友评论

          本文标题:搭建vue环境

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