其他分享
首页 > 其他分享> > vue环境搭建与项目配置

vue环境搭建与项目配置

作者:互联网

一、安装node.js


    安装vue前电脑中必须已经安装成功node.js
    node.js连接  https://nodejs.org/en/download/
    下载完成后,执行安装程序,直接进行安装即可(一直点next就行)
    安装完成后,打开命令行窗口(cmd),命令行窗口快捷键win+r
    输入node -v 和 npm -v 可查看安装的node.js和npm的版本号

         

 


二、安装vue

    1、使用npm进行安装(我直接用的这个方法安装的)
        缺点:安装速度较慢,使用国内源镜像安装较快
        (1)打开cmd,键入:npm install --global vue-cli ,回车后等待安装即可

           

 


        (2)vue-cli安装完成后,键入:npm install webpack -g ,回车进行webpack的安装

              

   2、使用国内源镜像安装
        (1)首先安装 cnpm
            npm install -g cnpm --registry=https://registry.npm.taobao.org
        (2)安装vue
            打开cmd,键入:cnpm install vue-cli -g,回车等待安装即可
            vue-cli安装完成后,键入:cnpm install webpack -g ,回车进行webpack的安装

三、创建vue项目并启动

    1、进入你的vue项目的工作空间下,使用cd命令进行切换
    2、执行:vue init webpack demo ,其中demo为vue项目的名称(这一步我没来得及截图,不会的可以私信我)
    3、进入新创建的vue项目下,(cd demo),执行:npm install , 进行依赖包的安装
    4、安装完成后,执行:npm run dev , vue项目启动分以下几步操作

  (1)第一步直接找到创建好的项目

              

 

      (2)第二步直接在输入框中输入cmd,就直接可以打开命令窗口

           

 

     (3) 第三步直接输入npm run dev

             


    启动成功后,打开浏览器,打开网址:127.0.0.1:8080 , 可以看到vue标识,项目启动成功

 

标签:npm,node,vue,配置,webpack,install,安装,搭建
来源: https://www.cnblogs.com/icerose0105/p/16692712.html