使用webstrom创建VUE项目

最新推荐文章于 2022-09-18 21:43:46 发布
原创 最新推荐文章于 2022-09-18 21:43:46 发布 · 243 阅读 · 1 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue #npm

本文详细介绍如何在Node.js环境下，利用Vue-CLI快速搭建一个Vue项目。从安装全局Vue-CLI开始，到初始化项目、安装依赖、运行开发服务器，最后在浏览器验证项目创建成功。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

1、在安装好nodejs的情况下，在webstrom命令行中输入
npm install -g vue-cli
运行结果
2、再次输入
vue init webpack vueTest(项目名字)
在这里插入图片描述

按上面的输入即可
（项目名称）
（项目说明）
（作者）
3、cd vueTest 打开项目
4、npm install 进行npm的安装
5、npm run dev 运行起来
6、在浏览器中输入localhost:8080即可看到下面的页面，就是项目创建成功了
在这里插入图片描述

webstorm怎么创建vue项目_在Webstorm上使用Vue webpack Element创建项目
weixin_39719427的博客
01-26 607
1.安装node.js1.1 到node官网下载node，如图选择适合自己的安装包。1.2 下载完成后安装，一直下一步就可以了。1.3 安装完成后，使用win + R 打开cmd，使用 node -v 查看node版本，node是自带npm的，使用 npm -v 可查看npm版本，如图所示：2.安装vue cli2.1 win10下在搜索框输入cmd，右键以管理员运行，如图所示：2....
初次使用webstrom简单创建vue项目的一些报错记录
lamuleimu的博客
07-15 1276
webstrom使用webpack报错记录，包括打包和loader的一些坑，含具体解决方法和部分解析.........
手把手一步步使用webStrom创建vue项目
火星男孩的分享空间
12-11 9148
一：安装配置node.js Node.js是一个Javascript运行环境。 npm是node的包管理工具。 下载node.js，配置环境变量： https://nodejs.org/en/download/ 验证是否成功： C:\Users\13579>npm -v 6.4.1 //或 C:\Users\13579> node -v v8.12.0 可参考：配置环境变...
在webstorm创建一个新的vue页面
vickey_xia的博客
05-25 1万+
在前端开发过程中我通常使用Sublime text 3跟webstorm一起开发这次先讲讲简单的，怎么用webstorm在已有的项目创建一个新的页面。1.在已有视图的文件夹右击会出现：选择NEW-》Vue Component2.创建页面的名称3.页面创建好之后，如果想在浏览器能够显示出来，需要在route.js文件上添加依赖。先是添加接口如：import QrcodeApply from './v...
用webstorm搭建vue项目（亲测，绝对实用）
热门推荐
KuoChingYang的博客
03-19 4万+
前提：已安装webstorm，这里主要讲搭建，webstorm的下载就不在这里说了。 1、了解一下基本知识 1.1、Node.js： Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。 Node.js 的包管理器 npm，是全球最大的开源库生态系统。 nodejs版本查询：node...
webStrom 创建vue 快捷键
weixin_43859511的博客
10-27 1819
步骤1：file → setting / ctrl +alt +s 步骤2：File | Settings | Editor | Live Templates 步骤3 创建模版组或者直接选择 步骤4 下面是我根据别人提示的模版自己创建的一个 <template> <div> </div> </template> <script> // 这里可以导入其他文件 例如：组件、工具js、第三方插件js,js...
WebStrom创建Vue3+Element-Plus项目
小小爪哇工程师的博客
09-18 7852
在element-plus官网复制Button 按钮源代码 粘贴到HelloWord.vue中。再次把button代码复制到helloword文件中，启动项目。此时需要安装typescript和ts-loader。node自己配置了环境变量，直接打开cmd查看版本。打开src目录下的main.js 替换成下面代码。再次启动项目，报如下错误，原因是上图复制的代码中。（2）等待项目自动初始化完成，点击运行。（4）出现下面页面，表示vue创建成功。（3）启动完成，点击地址访问。在项目目录中执行cmd命令。
使用WebStrom快速创建Vue项目
Andy·Wu的专栏
04-20 696
原英文出处：https://blog.jetbrains.com/webstorm/2019/03/get-started-building-apps-with-vue-js-in-webstorm/#more-10391 一、准备环境 1）、webstrom-2019.1 2）安装 Vue CLI，参考官网 npm install -g @vue/cli 二、WebStrom创建Vue项目 1...
webstrom Debug 调试vue项目的方法步骤
10-18
2. 创建Vue项目 在开始调试之前，你需要有一个Vue项目。可以使用Vue CLI来创建一个新的Vue项目，或者将现有的Vue项目导入到WebStorm中。 3. 启用调试模式 在WebStorm中，通常有两种方式可以启动调试模式：直接在...
如何使用webstrom创建vue2项目
最新发布
09-14
要在WebStorm中创建Vue 2项目，您可以按照以下步骤进行操作： 1. 打开WebStorm并点击“创建新项目”。 2. 在左侧的模板列表中，选择“Vue.js”。 3. 在右侧的“项目信息”部分，输入项目的名称和存储路径。 4. 在...
webstrom创建vue项目
03-25
要在WebStorm中创建Vue项目，请按照以下步骤进行操作： 1. 打开WebStorm并单击“Create New Project”。 2. 在下一个屏幕上，选择“Vue.js”并单击“Next”。 3. 在“Project name”字段中输入项目名称，并指定...
webstrom创建vue项目教学
09-07
在Webstorm上创建Vue项目的教学可以按照以下步骤进行： 1. 首先，确保你已经安装了Node.js。这是Vue项目所需的环境。 2. 打开Webstorm，并点击菜单栏中的"File"，然后选择"New"，再选择"Project"。 3. 在弹出的...
vue循环for里使用延时
wwm_wang_wen的博客
06-30 4488
vue for setTimeout 循环 延时
UNI-APP的事件处理
wwm_wang_wen的博客
09-27 803
<template> <view class="container"> <text>{{title}}</text> <input type="text" :value="title" @input="change" /> </view> </template> <script> export default { data() { return { title: '12345'
自定义一个类JsonResult，将数据封装作为传输到页面使用
wwm_wang_wen的博客
08-12 385
从数据库查询出的数据返回到页面中 public class JsonResult implements Serializable { private int state = 1; private String message = "ok"; private Object data; }
等高瀑布流页面布局
wwm_wang_wen的博客
12-08 371
<template> <div id="imt"> <div class="img-item"> <img src="../images/1.jpg"> </div> <div class="img-item"> <img src="../images/2.jpg"> </div>
flex的样式使用
wwm_wang_wen的博客
09-28 281
元素与主轴的对齐方式 /* 定义flex容器 */ display: flex; /* 设置容器内部元素的排列方向 row:定义排列方向，从左到右 row-reverse:从右到左 column:从上到下 column-reverse:从下到上 */ flex-direction: row-reverse; /* nowrap:不换行 wrap:换行 */ flex-wrap: nowrap; /* 设置元素在主轴上的对齐方式 flex-start
VUE项目的打包与发布
wwm_wang_wen的博客
08-12 250
VUE项目的打包与发布 1、在webstrom命令行中输入：npm run build 2、在输入：npm install -g test01 3、输入：test01 dist 4、在浏览器中输入: http://localhost:5000 ，可以访问到页面
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值