【前端】使用WebStorm创建第一个项目

文章目录

  • 前言
  • 一、步骤
    • 1、启动
    • 2、创建项目
    • 3、配置Node.js
    • 4、运行项目
  • 二、Node.js介绍


前言

根据前面文章中记录的步骤,已经安装好了WebStorm开发软件,接下来我们就用这个IDE开发软件创建第一个项目。

一、步骤

1、启动

启动软件。

在这里插入图片描述

2、创建项目

新建项目 》 选择路径 》 创建。
在这里插入图片描述

创建后的项目文件夹:

在这里插入图片描述

3、配置Node.js

如图所示,我们创建第一个项目后,有个默认文件,默认文件中有一行输出一句话的代码。但是提示WebStorm需要配置Node.js后才能工作。

右侧蓝色字体有引导下载的蓝色文字,直接点击下载Node.js后可以自动下载Node.js并安装

网上也有一些单独去下载配置的教程,但是这里自动下载安装更加简单便捷。

在这里插入图片描述
安装后可以之前要安装Node.js的提示没有了,右下角显示Node.js已经安装完成。

在这里插入图片描述

我们可以在选择的安装Node.js文件夹下查看文件的文件都有哪些。

在这里插入图片描述

4、运行项目

我们可以稍微修改下默认文件中的代码,然后点击右上角三角形运行按钮,便将这个项目运行了起来。

左下角已经输出运行结果。

在这里插入图片描述

二、Node.js介绍

Node.js运行于服务端的JavaScript解释器。

类似于运行Java的JVM虚拟机。Node.js就是运行JavaScript的虚拟机

Node.js 是一个开源的跨平台运行时环境,允许开发者在服务器端执行 JavaScript 代码。它由 Ryan Dahl 于 2009 年创建,并因其非阻塞、事件驱动的架构而迅速受到欢迎,这使得它非常适合构建可扩展和高性能的应用程序。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/20958.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

遥感与GIS在滑坡、泥石流风险普查中的实践技术应用

原文>>> 遥感与GIS在滑坡、泥石流风险普查中的实践技术应用 我国是地质灾害多发国家,地质灾害的发生无论是对于地质环境还是人类生命财产的安全都会带来较大的威胁,因此需要开展地质灾害风险普查。利用遥感(RS)技术进行地…

EasyExcel 自定义头信息导出

需求:需要在导出 excel时,合并单元格自定义头信息(动态生成),然后才是字段列表头即导出数据。 EasyExcel - 使用table去写入:https://easyexcel.opensource.alibaba.com/docs/current/quickstart/write#%E4%BD%BF%E7%94%A8table%E…

QT异步编程之QMetaObject::invokeMethod

一、概述 1、QMetaObject::invokeMethod是Qt的一个功能强大的方法,它用于动态地调用一个对象地槽函数或成员函数。 2、这个方法允许你在运行时通过对象地元对象系统调用函数,而无需直接使用函数指针或其它静态机制。 3、元对象系统是一个基于C的扩展…

斐波那契数列模型:在动态规划的丝绸之路上追寻斐波那契的足迹(上)

文章目录 引言递归与动态规划的对比递归解法的初探动态规划的优雅与高效自顶向下的记忆化搜索自底向上的迭代法 性能分析与比较小结 引言 斐波那契数列,这一数列如同一条无形的丝线,穿越千年时光,悄然延续其魅力。其定义简单而优美&#xff…

php 系统命令执行及绕过

文章目录 php的基础概念php的基础语法1. PHP 基本语法结构2. PHP 变量3.输出数据4.数组5.超全局变量6.文件操作 php的命令执行可以执行命令的函数命令执行绕过利用代码中命令(如ls)执行命令替换过滤过滤特定字符串神技:利用base64编码解码的绕…

使用vscode调试transformers源码

简要介绍如何使用vscode调试transformers源码 以源码的方式安装transformers(官方手册为Editable install) 优先参考官方手册 git clone https://github.com/huggingface/transformers.git cd transformers pip install -e .以下展示transformers/exa…

macos安装jmeter测试软件

java环境安装 a. 验证安装环境 java -version # 如果有版本信息,说明已安装 b. 安装jdk # 安装 Homebrew(如未安装) /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" # 安装 O…

2023年全国职业院校技能大赛GZ073网络系统管理赛项赛题第10套模块A:网络构建

​有问题请留言或主页私信咨询 2023年全国职业院校技能大赛 GZ073网络系统管理赛项 赛题第10套 模块A:网络构建 ​ ​ **目 **录 任务清单 (一)基础配置 (二)有线网络配置 (三)无线…

若依-@Excel新增注解numberFormat

Excel注解中原本的scale会四舍五入小数,导致进度丢失 想要的效果 显示的时候保留两个小数真正的数值是保留之前的数值 还原过程 若以中有一個專門的工具类,用来处理excel的 找到EXCEL导出方法exportExcel()找到writeSheet,写表格的方法找到填充数据的方法…

动静态链接与加载

目录 静态链接 ELF加载与进程地址空间(静态链接) 动态链接与动态库加载 GOT表 静态链接 对于多个.o文件在没有链接之前互相是不知到对方存在的,也就是说这个.o文件中调用函数的的跳转地址都会被设定为0(当然这个函数是在其他.…

python-leetcode 33.排序链表

题目: 给定链表的头结点head,请将其按升序排列,并返回排序后的链表 方法一:自顶向下归并排序 链表自顶向下归并排序的过程: 1.找到链表的中点,以中点为分界,将链表拆分成两个子链表。寻找链表的中点可以…

PyQt加载UI文件

1.动态加载 import sys from PySide6 import QtCore,QtWidgets from PySide6.QtWidgets import * from PySide6.QtUiTools import QUiLoaderclass readfile(QWidget):def __init__(self):super().__init__()self.uiQUiLoader().load("test.ui",self) self.__c…

深入解析NoSQL数据库:从文档存储到图数据库的全场景实践

title: 深入解析NoSQL数据库:从文档存储到图数据库的全场景实践 date: 2025/2/19 updated: 2025/2/19 author: cmdragon excerpt: 通过电商、社交网络、物联网等12个行业场景,结合MongoDB聚合管道、Redis Stream实时处理、Cassandra SSTable存储引擎、Neo4j路径遍历算法等42…

EasyRTC:开启智能硬件与全平台互动新时代

在当今数字化时代,实时音视频互动已成为企业与用户沟通、协作和娱乐的关键技术。无论是在线教育、视频会议、远程医疗还是互动直播,流畅、高效的互动体验都是成功的关键。然而,实现跨平台、低延迟且功能丰富的音视频互动并非易事——直到 Eas…

【前端框架】vue2和vue3的区别详细介绍

Vue 3 作为 Vue 2 的迭代版本,在性能、语法、架构设计等多个维度均有显著的变革与优化。以下详细剖析二者的区别: 响应式系统 Vue 2 实现原理:基于 Object.defineProperty() 方法实现响应式。当一个 Vue 实例创建时,Vue 会遍历…

springboot-ffmpeg-m3u8-convertor nplayer视频播放弹幕 artplayer视频弹幕

学习链接 ffmpeg-cli-wrapper - 内部封装了操作ffmpeg命令的java类库,它提供了一些类和方法,可以方便地构建和执行 ffmpeg 命令,而不需要直接操作字符串或进程。并且支持异步执行和进度监听 springboot-ffmpeg-m3u8-convertor - gitee代码 …

Linux下centos系统中使用docker容器中的ollama下载deepseek速度太慢解决办法

以下是使用shell脚本实现的一个示例,该脚本会尝试下载一个名为"deepseek-r1:32b"的模型。通过每隔60秒中断一次下载操作,从何恢复下载速度。亲测有效,其中需要将模型改为你自己要下载的模型 #!/bin/bashwhile true; do# 检查模型是否已下载完…

自动创建spring boot应用(eclipse版本)

使用spring starter project创建项目 设置Service URL 把Service URL设置为 https://start.aliyun.com/ 如下图: 使用这个网址,创建项目更快。 选择Spring Web依赖 项目结构 mvnw和mvnw.cmd:这是maven包装器(wrapper)脚本&…

基于flask+vue的租房信息可视化系统

✔️本项目利用 python 网络爬虫抓取某租房网站的租房信息,完成数据清洗和结构化,存储到数据库中,搭建web系统对各个市区的租金、房源信息进行展示,根据各种条件对租金进行预测。 1、数据概览 ​ 将爬取到的数据进行展示&#xff…

uniapp 滚动尺

scale组件代码&#xff08;部分class样式使用到了uview1.0的样式&#xff09; <template><view><view class"scale"><view class"pointer u-flex-col u-col-center"><u-icon name"arrow-down-fill" size"26&qu…