IDEA创建vue项目详解

一、安装node.js

node.js中文网
在这里插入图片描述

  • 选择相应的压缩包,下载成功后,解压直接默认安装即可

  • 安装成功后,打开cmd输入 npm -v 和 node -v 命令可查看版本号
    在这里插入图片描述

  • 若 控制台显示npm或者 node命令不可用,则是没配置环境变量。
    在这里插入图片描述
    在这里插入图片描述

  • 找到自己的node安装路径配置即可

  • 配置淘宝镜像,在cmd输入以下命令

    npm i -g cnpm --registry=https://registry.npm.taobao.org
    
  • 安装vue-cli脚手架构建工具

    npm i -g vue-cli
    这个安装的是2.x的版本
    npm install -g @vue/cli
    这个安装的是3.x的版本
    vue -V
    测试是否安装成功:V是大写的
    

    若vue命令不可用,则是需要配置环境变量

二、使用IDEA创建vue项目
  • idea环境准备,先安装vue.js插件,具体操作如下图:
    在这里插入图片描述
    在这里插入图片描述

    安装完成后重启idea。

  • 打开idea创建一个vue项目,具体操作如下图:
    在这里插入图片描述
    在这里插入图片描述

  • 补充:项目创建完成后进入 Terminal 窗口输入:

     vue init webpack demo(demo是项目名)
    

    然后根据提示输入y或者n即可
    在这里插入图片描述

  • 创建完毕,然后配置运行环境
    在这里插入图片描述
    在这里插入图片描述
    配置完后,点击运行。在这里插入图片描述

致谢

感谢您阅读我的文章,如果我的文章对您有所帮助,请分享出去让更多的小伙伴知道;如果我的文章有误导或是存在错误,请指点更正,大家一起共同进步。谢谢!

Logo

基于 Vue 的企业级 UI 组件库和中后台系统解决方案,为数万开发者服务。

更多推荐