IDEA使用vue的安装与配置(详细教程)

在idea中使用vue首先idea的配置以及环境要搭建好,然后就按照以下操作进行就可以!(注:我使用的idea是2021.1.3 版本)

第一步

去官网下载node.js ,官网地址:https://nodejs.org/en/

然后进行安装,安装过程只需要一直点下一步就行,不需要勾选任何选项(目录可以更改,最好使用默认)

第二步

电脑打开cmd,输入 npm install -g cnpm --registry=https://registry.npm.taobao.org 安装淘宝镜像

 

输入npm install -g @vue/cli安装脚手架

然后分别输入vue -V(这是大写的VVVVVV~~~)     node -v   和   npm -v查看相应的版本号

 (版本不一致不影响安装,可能会影响后续使用,我目前也不知道有什么影响哈哈哈哈哈)

 第三步

在此电脑随便位置创建好你需要放项目的文件夹

 

然后在cmd上进入该目录,使用 vue create xxxx创建vue项目(xxxx是你的项目名称,什么名字看个人心情,啊哈哈哈!)

 

然后进入下面的选择,Enter是确认选择,上下键是换选择,第二页的*是用空格来取消标记

 

 

 

 

 

创建好后执行蓝色提示命令运行项目

 

 等待运行好后,会出现一个地址,复制到浏览器打开,至此vue项目创建成功(恭喜你完成一半啦!!!!!!)

 

 

 第四步

打开idea,用idea打开我们刚才创建的vue项目 

然后点击 左上角的file,再点击settings(我改成了中文请忽略)

 然后选择plugins在搜索款搜Vue.js进行安装应用

 然后打开src/views/HomeView.vue,进行编辑增加以下内容(注意data前还有英文逗号,提醒粗心的小伙伴):

<h1>{{msg}}</h1>
data() {
      return {
          msg: "创建项目成功!"
      }
    }

 增加好后,回到浏览器查看

 发现图标上多了我们打进去的字!

到此安装,使用成功,更多vue的安装与问题后面文章再发。欢迎评论与指导。

 

 

 

  • 19
    点赞
  • 199
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 3
    评论
使用IntelliJ IDEA开发Vue项目时,可以通过安装Vue插件来提供更好的开发支持。安装Vue插件有两种方法: 方法一:在IDEA的设置中直接搜索并安装Vue插件。打开IDEA,点击File菜单,选择Settings(或Preferences),在弹出的对话框中选择Plugins,然后在搜索框中输入"vue",如果能够搜索到Vue插件,点击Install按钮进行安装即可。 方法二:如果无法在搜索中找到Vue插件,可以前往官方网站下载插件。根据你所使用IDEA版本,下载对应的Vue插件压缩包。下载完成后,解压插件文件,并将文件夹复制到IDEA安装目录下的plugins文件夹中。然后重新打开IDEA,在设置中的Plugins选项中选择Install Plugin from Disk,并导航到刚刚复制的插件文件夹中,选择其中的vuejs文件进行安装。安装完成后,点击ReStart按钮重启IDEA,即可开始使用Vue插件。 为了更好地使用Vue插件,你可以进行以下设置: 1. 在IDEA的设置中,找到Editor -> File Types,然后在右侧的列表中找到Vue模板,点击右侧的"+"号,添加*.vue后缀,点击完成退出。这样可以让IDEA正确识别.vue文件。 2. 为了方便使用,你可以将Vue加入到创建文件选项栏中。在设置中找到Editor -> Live Templates,然后在左侧的列表中找到Vue,点击右侧的"+"号,将其添加到模板选项中。这样在新建文件时可以直接选择Vue模板进行创建。 回答完问题后,我给出了以下几个相关问题供你参考: 相关问题: 1. 如何在IntelliJ IDEA使用ESLint插件来辅助开发Vue项目? 2. 除了Vue插件,还有哪些常用的插件可以提高Vue开发效率? 3. 如何在IntelliJ IDEA中进行Vue项目的调试和测试? 4. 在使用Vue插件时,如何自定义代码模板和快捷键? 5. 有没有推荐的Vue开发工具或IDE,除了IntelliJ IDEA
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

计科的小白

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值