PhpStorm创建Vue项目,运行及打包发布

本文详细介绍了如何使用PhpStorm创建Vue项目,从安装Node.js到配置全局vue-cli和webpack,再到项目的运行和打包发布。在PhpStorm中通过npm标签管理项目,打包后需将dist目录部署到web服务器上。此外,还提供了快速定位@符号后的文件的配置方法。
摘要由CSDN通过智能技术生成

话不多说,直接上干货,使用WebStorm开发的同学,步骤与PhpStorm基本是一致的。

1. 安装Node

打开Node.js的官方网站 http://nodejs.cn/download/,找到windows版本的安装包,将其下载到本地,然后双击安装即可,具体安装过程,此处忽略。

Npm命令解释:

npm install moduleName:安装模块到项目目录下。

npm install -g moduleName:-g 的意思是将模块安装到全局,具体安装到磁盘哪个位置,要看 npm config prefix 的配置。

npm install -save moduleName:--save 的意思是将模块安装到项目目录下,并在 package 文件的 dependencies 节点写入依赖,-S 为该命令的缩写。

npm install -save-dev moduleName:--save-dev 的意思是将模块安装到项目目录下,并在 package 文件的 devDependencies 节点写入依赖,-D 为该命令的缩写。

2. 安装cnpm

如果网络比较慢,可以先安装cnpm(中国版的npm࿰

PHPStorm中开发Vue应用的方法有很多。一种常见的方法是使用webpack来构建Vue开发环境。首先,你需要安装Node.js和npm来管理你的项目依赖。然后,在你的Vue项目根目录下创建一个package.json文件,可以运行npm init命令来生成。在package.json文件中,你需要添加一些必要的依赖,比如webpack、vue-loader等。这些依赖可以在引用提供的链接中找到详细的安装和配置步骤。 另一种方法是使用PHPStorm的插件来支持Vue开发。PHPStorm有一个名为Vue.js的插件,它提供了代码高亮、语法检查、智能提示等功能,使得在PHPStorm中编写Vue代码更加方便。你可以在PHPStorm的插件市场中搜索并安装这个插件。 除了安装插件,PHPStorm还提供了一些其他的Vue开发工具。例如,它支持使用ESLint进行代码规范检查,可以在项目设置中配置并启用ESLint。此外,PHPStorm还支持使用Git进行版本控制,可以将你的Vue项目与Git仓库进行集成。 总之,PHPStorm提供了多种方式来支持Vue开发,包括使用webpack构建开发环境、安装Vue.js插件、配置ESLint和Git等。你可以根据自己的需求选择适合的方式来进行Vue开发。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *3* [VUE 学习一 PHPSTORM 搭建VUE项目](https://blog.csdn.net/shuilan0066/article/details/99634424)[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_1"}}] [.reference_item style="max-width: 50%"] - *2* [从零搭建Vue开发环境](https://download.csdn.net/download/weixin_39841848/11524400)[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_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值