当前位置: 首页 > news >正文

在IDEA中创建vue hello-world项目

工作中最近在接触vue前端项目,记录一下从0搭建一个vue hello world项目的步骤

1、本地电脑安装配置node、npm

D:\Project\vue\hello-world>node -v
v14.21.3

D:\Project\vue\hello-world>npm -v
6.14.18

D:\Project\vue\hello-world>

2、设置npm国内淘宝的景象

建议配置国内的景象,国外镜像下载依赖有时会失败

npm config set registry http://registry.npm.taobao.org/

3、在idea中安装Vue.js插件

网上搜索相关教程

4、创建vue.js项目

file->new project -> JavaScript -> Vue.js

5、指定项目名字

例如项目名字默认为untitled

Finish,之后会执行 vue create tntitled帮助我们创建好项目

项目创建好之后,会在idea下方出现以下提示信息

�  Generating README.md...

�  Successfully created project idea-create-hello-world-project.
�  Get started with the following commands:

 $ npm run serve
 

6、在Terminal中执行启动命令

npm run serve

7、在浏览器中访问 http://localhost:8080/

http://www.lryc.cn/news/307611.html

相关文章:

  • 如何获取pnpm存储目录
  • QT两个类之间使用信号槽
  • 【Ubuntu】使用WSL安装Ubuntu
  • 【Node.js】自动生成 API 文档
  • 小红书3C家电行业种草营销策略打法,纯干货
  • 防火墙的内容安全
  • Redis 管道详解
  • 【Redis】理论进阶篇------浅谈Redis的缓存穿透和雪崩原理
  • Rocky Linux安装部署Elasticsearch(ELK日志服务器)
  • Linux浅学笔记04
  • 【Day59】代码随想录之动态规划_647回文子串_516最长回文子序列
  • ECLIP
  • STM32 +合宙1.54“ 电子墨水屏(e-paper)驱动显示示例
  • 使用Postman和JMeter进行signature签名
  • uni-app nvue vue3 setup中实现加载webview,解决nvue中获取不到webview实例的问题
  • IPD(集成产品开发)—核心思想
  • uniapp android 原生插件开发-测试流程
  • MyCAT从入门到实战(配置文件介绍)
  • 【LeetCode-300】最长递增子序列(动归)
  • Mysterious-GIF-攻防世界-MISC
  • 【数据结构和算法初阶(C语言)】链表-单链表(手撕详讲单链表增删查改)
  • 【Go语言】Go语言中的切片
  • Qt程序设计-钟表自定义控件实例
  • Redis的发布订阅功能教程,实现实时消息和key过期事件通知功能
  • 4核8g服务器能支持多少人访问?
  • 【Android】切换系统全局语言设置
  • 【递归】【回溯】Leetcode 112. 路径总和 113. 路径总和 II
  • AxureCloud配置文件详细介绍
  • Centos开机网卡自启动失败
  • 华为OD技术面试案例3-2024年