手把手创建一个vue项目,以及创建过程中可能出现的问题

创建一个vue项目

在这里插入图片描述

1.下载安装Node.js、npm

百度搜索Node.js,进入官网直接下载

下载并安装后就默认有了npm

然后检查是否安装成功只需打开cmd,运行下面命令

Node -v

npm -v

2.在cmd下依次运行

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

npm install -g vue-cli

3.在目标文件夹下按住shift+鼠标右键进入Powershell窗口

然后输入

vue init webpack vue01(vue01为项目名)

若出现以下情况

在这里插入图片描述

就要打开win10的搜索栏,搜索Powershell,点击以管理员方式运行

然后在打开的窗口输入:

set-ExecutionPolicy RemoteSigned

然后选择输入A即可返回原Powershell窗口继续创建

继续运行

vue init webpack vue01(vue01为项目名)

//以下都是自动弹出命令注意观察然后按回车就行
 Project name vue01 //按回车
 Project description //按回车
 Vue build standalone //按回车
 Install vue-router? //建议输入Y后按回车
 Use ESLint to lint your code?//代码规范建议先输入N后按回车
 Set up unit tests//建议输入N后按回车
 Setup e2e tests with Nightwatch?//建议输入N后按回车
 Should we run `npm install` for you after the project has been created? (recommended) //第一次创建vue项目建议输入N后回车,然后生成项目后在运行 npm install 来给刚创建的项目加入依赖

执行完成后说明vue01项目已经在目标文件夹下创建成功

然后继续在此powershell窗口下给项目添加依赖,类似于Maven

输入以下命令

 cd .\vue01\
 npm install

运行成功后就能在项目文件夹看到多了一个node_modules文件夹,文件夹里都是要用到的所有依赖

4.最后用WebStorm 打开创建的vue项目

打开WebStorm软件,点击open,然后找到刚才在目标文件夹创建的vue项目就🆗了

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
在Idea创建Vue项目的步骤如下: 1. 首先,打开Idea并选择创建一个新的项目。 2. 在创建项目的窗口选择“Vue.js”作为项目类型,并填写项目的名称和存储路径。 3. 点击“Next”继续。 4. 在项目设置,选择所需的Vue版本。如果没有特殊要求,可以选择默认版本。 5. 点击“Next”继续。 6. 在安装依赖项的选项,选择“自动安装依赖项”。这将自动运行npm install命令来安装Vue项目所需的依赖项。 7. 点击“Next”继续。 8. 在可选插件的选项,如果你的项目需要使用vue-router,选择安装vue-router。 9. 点击“Next”继续。 10. 在创建项目之前的最后一步,选择项目的存储库类型(如Git)和相关设置(如存储库URL)。 11. 点击“Finish”完成项目创建。 12. 稍等片刻,Idea将自动为您创建Vue项目,并安装所需的依赖项。 13. 创建完成后,您就可以在Idea的项目结构看到新创建Vue项目。 至此,您已经成功在Idea创建了一个Vue项目。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [手把手使用idea创建vue项目](https://blog.csdn.net/shaoming314/article/details/124653632)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_2"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值