ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

vue环境搭建与项目配置

2022-09-14 13:31:14  阅读:258  来源: 互联网

标签:npm node vue 配置 webpack install 安装 搭建


一、安装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

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有