VueJs开发笔记—IDE选择和优化、框架特性、数据调用、路由选项及使用
一、IDE的选择:
VsCode和WebStorm都是不错的选择,说一下两者的优缺点,调试便捷性来说两者不相上下.
WebStorm缺点:性能方面VsCode远好于WebStorm;
WebStorm优点:代码引用追踪Ws有VsCode无,控制台输出WS有着色能看出那块代码有问题,VsCode无着色控制台日志和bug查看不直观;
综合使用来说:推荐使用WebStorm,如果你的电脑配置实在不好可以酌情使用VsCode.
1.先说VsCode的配置:
首先是要装VsCode的扩展插件,点击左上角最后一个图标,在搜索里面输入JavaScript (ES6) snippets/NPM/Vue 2 Snippets;
第二步调试配置:VsCode第一次运行只需要把项目切换到项目根目录/build/dev-server.js点击运行按钮或者使用快捷键F5就可以启动项目了,第一次启动之后ide就会把启动的js记录下来,下次不管在那个页面只需要使用F5启动即可;
2.再说WebStorm的使用优化和vuejs项目的调试配置:
①.优化WebStorm解决卡顿的问题。
WebStorm的优化主要在设置内存上,防止ws卡死,设置步骤如下:webstorm安装主目录>bin>WebStorm.exe.vmoptions,更改第二行:-Xms526m,第三行:-Xmx1024m;
②.配置vuejs调试js就不需要输npm run dev 启动命令。

二、VueJs框架特性和数据调用:
框架特性:纯前端语言,要配合后台接口才可以实现数据交换,vuejs相当于一个编译工具,把你写的代码和依赖的三方库,编译成浏览器可以识别js语言和html页面,所有的业务在用户的浏览器端执行。
数据调用:既然是客户端语言那么如果让vuejs去做服务器端渲染(SSR)是一件极其困难的事情,官方是这样说的:
“在 2.3 发布后我们发布了一份完整的构建 Vue 服务端渲染应用的指南。这份指南非常深入,适合已经熟悉 Vue, webpack 和 Node.js 开发的开发者阅读。请移步 ssr.vuejs.org。(目前只有英文版,社区正在进行中文版的翻译)”,可见vuejs在服务器端渲染是非常吃力不讨好的(当然有兴趣的朋友可以去试一下ssr的搭建和渲染,对于深入了解一门语言的原理是很有帮助的),既然vuejs不擅长做服务器端渲染,我们还是把目光聚焦在vuejs的前端操作上,那么一个前台站点去掉用后台最直接的方式就是ajax或者是rpc远程调用,ajax的使用可以使用一些优秀的框架,比如axios、zeptojs等,这些都是可以满足需求的,当然如果使用rpc的话可以使用hprose等。
具体常用的ajax请求的调用方式和方法,我这里就不细说了,需要的请自行百度,vue官方推荐的交换框架是axios查看详情:https://npm.taobao.org/package/axios;
三、VueJs路由选项以及使用
路由选项:

使用:比如我要使用启用HTML5 history功能的路由器,
var router = new VueRouter({
mode:'history'
});
到这了你可能已经对VueJs有了大体的了解,之前我还写了一篇关于:《VueJs深入浅出—常用操作手册》点击查看,希望我的文章能对你有所帮助!
祝:周末愉快!
VueJs开发笔记—IDE选择和优化、框架特性、数据调用、路由选项及使用的更多相关文章
- VueJs开发笔记—IDE选择和WebStorm性能优化、框架特性和数据调用、路由选项以及使用
一.IDE的选择: VsCode和WebStorm都是不错的选择,两者运行调试都非常的方便都可以使用快捷键运行和停止,就打开项目的速度和对电脑配置的要求来说,vscode要比webstorm要出色很多 ...
- C#开发笔记之01-为什么开源框架会大量的使用protected virtual?
C#开发笔记概述 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/957 访问. 我们在很多开源框架中会经常看到prote ...
- Android移动APP开发笔记——Cordova(PhoneGap)通过CordovaPlugin插件调用 Activity 实例
引言 Cordova(PhoneGap)采用的是HTML5+JavaScript混合模式来开发移动手机APP,因此当页面需要获取手机内部某些信息时(例如:联系人信息,坐标定位,短信等),程序就需要调用 ...
- [开发笔记]GCC 分支预测优化
#define likely(x) __builtin_expect(!!(x),1)#define unlikely(x) __builtin_expect(!!(x),0) 用于优化在做分支判断的 ...
- iOS开发笔记系列-基础7(C语言特性)
Objective-C是C语言的扩展,因此,也具备很多C语言的基本特性,这里只罗列部分. 块(Blocks) 块是对C语言的一种扩展,它并未作为标准ANSI C所定义的部分,而是Apple添加到语言中 ...
- C#开发笔记,点点细微,处处真情,记录开发中的难言之隐
该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/956 访问. 概述 本系列文章将会向大家介绍本人实际开发过程中所遇到技术 ...
- C#开发笔记之02-什么时候使用OnXXX方法,这种命名是什么意思?
C#开发笔记概述 该文章的最新版本已迁移至个人博客[比特飞],单击链接 https://www.byteflying.com/archives/958 访问. 你也许经常会看到别人写的代码里有OnXX ...
- odoo开发笔记 -- div标签代替odoo button写法
odoo开发笔记 -- div标签代替odoo button写法 并调用自定义js <footer> <div id="confirm_request_cloud_repo ...
- python开发笔记-通过xml快捷获取数据
今天在做下python开发笔记之如何通过xml快捷获取数据,下面以调取nltk语料库为例: import nltk nltk.download() showing info https://raw.g ...
随机推荐
- typescript里面调用javasript
index.html 里面加入函数: function tellYou() { egret.log("tell you."); javascript:android.funA(); ...
- ----关于posotion的sticky与fixed的区别----
sticky 出现在正常流当中,不能设置定位,随页面滚动 (sticky = relative + fixed) fixed 不出现在正常流当中,能设置定位,随页面滚动 eg: html: <p ...
- linux_文件夹实现挂载(必须在同一网段)
将外部想要挂载传输的目录开启共享文件夹 首先进行安装 yum install nfs-utils rpcbind yum install nfs* 建立想要挂载的目录 查看可以执行挂载的目录有哪些 s ...
- linux之用户密码破解的操作
一 无引导介质救援模式破解root用户密码 1 启动虚拟用户,在GRUB启动画面停留的那段时间,用上下键选择启动项. 2 用‘e’键进入你选择的启动项 ,然后用上下键将光标移动到“linux16... ...
- windows安装mongodb及相关命令
- 安装 解压: mongodb-win32-x86_64-2008plus-ssl-3.6.4.7z 将文件夹改名为mongodb 移动文件到指定目录下,如: C:\python\soft ...
- java 基础--理论知识
变量分:局部变量全局变量-----------------------------------------------------变量三大特性[标识符,初始值,作用域]定义变量:语法:[访问修饰符] ...
- js实现抽奖
抽奖.html: <!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
- Docker 启动不了容器的问题
今天在运行 docker 的时候,就是执行 docker exec 命令的时候,发现一直报错.具体的报错信息如下: Error response from daemon: Container XXX ...
- Python序列结构
python中常用的序列结构由列表.元组.字典.字符串.集合等,列表.元组.字符串等有序序列以及range对象均支持双向索引 是否有序 序列结构 是否是可变序列 有序序列 元组 不可变序列 有序序列 ...
- pwm互补输出 死区设置
void TIM8_PWM_Init(u16 arr,u16 psc){ GPIO_InitTypeDef GPIO_InitStructure; TIM_TimeBaseInitT ...