vue开发环境搭建(WebStorm)
转载:https://blog.csdn.net/Nero__A/article/details/62228646
一、安装Node.js,搭建Vue环境
1、访问Node.js官网(https://nodejs.org/en/download/)进行安装包下载。
2、下载成功之后运行安装程序,进行安装。
如果是用安装程序进行安装,在安装过程中会自动进行Nodejs环境变量的配置,如果是通过其他方式进行安装,可能需要手动配置环境变量。
完成安装后,可以打开命令行,直接使用node命令,进入node.js交互模式。
然后可以输入console.log("Hello,World");测试安装。
3、设置npm的默认安装路径,和缓存路径
// 设置npm安装程序时的默认位置
npm config set prefix "D:\Program Files\nodejs\X64\node_global"
// 设置npm安装程序时的缓存位置
npm config set cache "D:\Program Files\nodejs\X64\node_cache"
然后在把D:\Program Files\nodejs\X64\node_global\node_modules路径添加到环境变量PATH中。
4、安装webpack和vue-cli脚手架
在命令行中执行下列两个命令,进行安装。
npm install webpack -g
npm install vue-cli -g
二、创建vue测试项目
1、打开命令行,进入到希望创建vue测试项目的路径,然后在命令行中执行下列命令,进行项目创建。
vue init webpack vue_test //其中vue_test为项目名称
2、在命令行中进入到项目路径,然后执行npm install命令,安装项目需要的依赖。
安装完成。
3、然后执行npm run dev命令,运行项目。
三、安装WebStom
1、在百度上找一个WebStorm 11的安装包进安装。
2、破解WebStorm 11
把JetbrainsCrack-2.5.3.jar复制到WebStorm的bin目录下。
编辑bin目录下WebStorm.exe.vmoptions和WebStorm64.exe.vmoptions两个文件,在两个文件的第一行增加下列内容。
-javaagent:H:\WebStorm 11.0.3\bin\JetbrainsCrack-2.5.3.jar
然后打开WebStorm就可以完成注册。
四、在WebStorm中打开vue项目
1、在WebStorm中打开刚才创建的vue测试项目,项目的js文件可能会有编译异常。
可以通过在setting文件中修改js版本来解决。
2、在WebStorm中设置项目的快速启动
在WebStorm右上角选择“Edit Configrations”,进入配置界面。
添加一个新的Node.js配置。
在配置界面中配置下图红框中的几个属性即可。
vue开发环境搭建(WebStorm)相关推荐
- Vue 开发环境搭建(Mac 版)
Vue 开发环境搭建(Mac 版) 参考: https://www.jianshu.com/p/cc722eba1f46 https://www.runoob.com/w3cnote/vue2-sta ...
- laravel+vue开发环境搭建
From: https://www.jianshu.com/p/1c2cc11ba46f 描述 最近通过laravel在公司做了一些项目,但本身前端出身的我,总是感觉lphp开发过程中,前端写好页面, ...
- 一 vue开发环境搭建
2016年,Vue同Angular.React形成三足鼎立的局面,让前端的开发者顾不暇接,今天我们就来了解一下Vue的环境搭建. 一.node.js安装: node.js:一种javascript的运 ...
- vue开发环境搭建Mac版
一.前言 因工作缘故,需要做一个移动端app,面对2016下半年至今webapp最流行的三个技术React,angular,vue,三选一,如何先,经过前期的技术选型,最后决定使用vue.具体查看本人 ...
- Vue开发环境搭建及在docs新建vue项目
参考: https://www.cnblogs.com/winter92/p/7117057.html (写在开头的废话:相信很多人在学习vue这个框架时,最开始搭建开发环境,容易遇到一些大大小小的坑 ...
- vue 开发环境搭建
1.创建vue项目 1.node js 生成项目,编译项目 2.hbuilder 开发环境 1.下载安装node js http://nodejs.cn/download/ 确认是否安装成功 如果安装 ...
- Vue开发环境搭建和vue-cli脚手架
vue本质是一个js脚本,提供了一个前端框架.在开发时,可以直接引入这个js脚本,也可以使用脚手架工具,在本地搭建一个项目. Vue.js安装 方法一.在 Vue.js 的官网上直接下载 vue.mi ...
- Vue开发环境搭建详细操作(NodeCnpmVue)
目录 一.安装node.js 二.安装cnpm 三.安装Vue 四.常用命令 五.其他扩展信息 一.安装node.js 1.官网下载地址:Download | Node.js 2.设置nodejs p ...
- Cesium Vue开发环境搭建
最近被问到如何在 vuejs 中集成 cesium,首先想到的官网应该有教程.官网有专门讲 Cesium and Webpack(有坑),按照官网的说明,动手建了一个Demo,在这记录下踩坑过程. 一 ...
- VS Code + Vue 开发环境搭建
1.下载并安装 Visual Studio Code 2019 2.Visual Studio Code 2019安装成功后,打开VS Code 工具点击左侧[扩展]菜单,在搜索栏中输入 Chines ...
最新文章
- c语言循环练习[xcode]
- Apple Music 会员免费领啦!
- 强大的代码扫描工具SonarLint之安装使用
- Leetcode: Binary Tree Maximum Path Sum
- iOS之深入解析malloc的底层原理
- 【MFC】显示系统时间的状态栏
- 数据光端机设备性能指标介绍
- 需要vmwareinstalldisk上的文件vmnet_手机上一键就能进行PDF与其他文件的相互转换,果然厉害到不行...
- NTFS MFT元文件碎片分析
- 元组的相关操作,定义,查找,修改
- Java添加多行数据到mysql中_在mysql中插入多行
- 阿里巴巴Java开发文档2020版学习-日期时间
- 报错: error in ./node_modules/@vueuse/core/index.mjs
- Java中的BigDecimal,你真的会用吗?
- Web网页尺寸(1)
- arduino烧录esp8266出错:error: espcomm_upload_mem failed
- SQL基本语句学习(上)
- AI智能语音机器人源码供应批发采购
- 正则表达式实例:取得普陀区所有的小区名字和地址
- 什么是GCT考试,GCT考哪些课目(转)