在vue项目中使用codemirror插件实现代码编辑器功能(代码高亮显示及自动提示) 1.使用npm安装依赖 npm install --save codemirror; 2.在页面中放入如下代码 <template> <textarea ref="mycode" class="codesql" v-model="code" style="height:200px;width:600px;"><

1.官方下载sublime(http://www.sublimetext.com/3) 然后需要两步(1)上传插件主包Package Control(2)更改channels的配置信息(原来是国外的需要FQ给他把资源换成可以访问的http或者本地资源即可) 2下载sublime安装插件的主包(https://github.com/wbond/package_control) 下载压缩包后解压改名字为  Package Control上传到下图所示的和user同级的地方即sublime的Packa

vue父路由高亮不显示 首页和考试中心作为父路由,点击时发现不高亮,是因为路由配置有问题 因为首页和考试中心已经重定向到homepage和tpersonal-data这两个路由,当点击首页和考试中心的时候,页面显示的是homepage和personal-data,所以需要将点击这两个a链接的时候路由跳转到重定向页面

有一个需求是在已有列表中搜索关键词,然后在列表中展示含有相关关键字的数据项并且对关键字进行高亮显示,所以该需求需要解决的就两个问题: 1.搜索关键词过滤列表数据 2.每个列表高亮关键字 ps: 此问题基于数组对象,其他数据类型也可参考此思路. 关键词搜索:过滤数据很简单,无非就是监听search,对源数据过滤即可,贴一下代码: const search = this.search if (search) { this.showdata = this.copyshowdata.filter(dat

正常路由嵌套是没有问题的,但是如果你已经在当前主路由页面了,然后再次点击主路由就会出现页面数据空白的情况 看代码: //主路由通过v-for循环出来 <div class="list-group"> <a href="javascript:;" v-on:click="doNothing" class="list-group-item" v-if="getPages.length != 0"

如果webstorm中 提示 Unknown html tag el-*** 说明没有加载 node_modules 下的 element-ui 解决办法就是: 在webstorm 打开的状态下 第一步:先卸载 element-ui 插件 >npm uninstall element-ui 第二部:重装 element-ui 插件 >npm install --save element-ui 这个时候 webstorm就会自动加载 element-ui 插件, el-** 标签 就可以正常使用

一.将插件克隆到Sublime的packages目录 1.下载并解压插件(或直接git命令clone),得到vue-syntax-highlight-master文件夹 插件地址:https://github.com/vuejs/vue-syntax-highlight 2.点击browse packages按钮打开packages目录 3.将vue-syntax-highlight-master文件夹及内容拷贝到packages目录下 二.加载插件 1.ctrl+shift+p打开命令面板,输

1. 下载安装nodejs 截至2018-06-05 最新稳定版本为 8.11.2,直接 next ,不改目录. PS C:\Users\Administrator> node -v v8.11.2 PS C:\Users\Administrator> npm -v 5.6.0 2. 安装node后,设置 npm 淘宝代理镜像 npm config set registry https://registry.npm.taobao.org npm info underscore (如果上面配置正

一.安装Node.js(js的运行环境) 1.在Node.js官网https://nodejs.org/en/download/下载安装包.2.下载后进行安装.3.打开命令行,输入node -v可以查看到版本号.输入npm –v可看到npm版本号.新版的Node.js已自带npm(类似.net中的nuget包管理器),安装Node.js时会一起安装.(将来要更新npm可用这个命令npm intall npm@latest -g)4.在我的win10系统中可以看到环境变量也已经自动配置好了.如下图

第一步:全局安装babel-cli npm install -g babel-cli 第二步,新建一个空项目,在 WebStorm 中的当前项目中打开 Terminal,进入项目的根目录下, 安装 ES2015 preset,ES2015 preset会自动转译那些需要转换为 ES5 的 ES6 代码. npm install --save-dev babel-preset-es2015 如图: 第三步:根目录路径下新建.babelrc文件,内容如下 { "presets": [&qu

上一章简约的介绍了CkEditor编辑器,可以编辑js逻辑代码,css,html,C#代码,这章我根据实际例子,讲解怎么编写C#代码和怎么调用它. 大家都还记得刚刚接触程序编时的hello Word吧,首先我来介绍在编辑器上写了返回“hello Word”的C#方法,让后怎么去调用返回对应hello Wrod方法,具体代码如下: 运行预览效果如下图 页面加载之后就弹出了hello world对话框.证明获取到了我们写返回字符串. 注意编辑C#代码 并可以用ajax调用,C#代码方法必须要有一定的

第一步,新建一个项目,我这里建立了基于express 的node项目 第二步:将JavaScript语言版本切换为ECMAScript6 点击File —>settings,弹出设置框.把js的版本设置为: ECMAScript 6 第三步:  紧接着配置javascript的下的选项, 并点击apply启用.并点击OK按钮. 第四步: 安装 Babel CLI 并配置 File Watchers 实现自动转译.第三步安装完,就出现了下面的提示. 在 WebStorm 中打开 Terminal,

下载完nodeJS后,可选择更改配置目录 1.npm config set prefix "D:\node\node-global"<!--配置全局安装目录--> 2.npm config set cache "D:\node\node-cache"<!--配置缓存目录--> 配置环境变量path添加 node.exe 的目录文件夹路径 和 D:\node\node-global (npm设置的全局安装的目录文件夹路径) 配置环境变量NODE

在这一集我们将讲到如何从安装vue-cli开始,到新建一个本地项目,再到vscode中关于eslint的配置,以及本地项目关联公司远程项目的基本操作. 一,初始化本地项目 1,首先,全局安装vue-cli 3.0 2.检查vue-cli的版本,确定是3.0以上 3,新建一个叫question-editor的本地项目,注意这里的配置,预设置选择手动,勾选必要的Babel,Router,CSS预处理器,Linter格式化工具.不选择历史模式,CSS预处理器的选择看个人喜好,SCSS和Less其实语法

在 VSCode 中编辑代码时,在有 v-for 的语句下面有一条红色波浪线,鼠标放上去有提示 Elements in iteration expect to have 'v-bind:key' directives..代码如下: <p v-for="line in lines"> {{line}} </p> 搜索了一下找到了这个讨论https://github.com/vuejs/vetur/issues/261. 原来这是 ESLint 的一个 featur

转自https://blog.csdn.net/junshangshui/article/details/80376489 一.环境搭建及创建项目 1.安装node.js,webpack 2.安装vue脚手架cli npm install vue-cli –g 3.新建项目 vue init webpack vue-hello 其中需要用上下键选择(选择上面默认的那条) 4.切换到项目目录安装项目依赖项(即生成node_modules文件夹) cd vue-hello npm install 5

wepy.js借鉴了Vue的语法风格和功能特性,对官方提供的框架进行了封装,更贴近于MVVM架构模式,让开发者更加容易上手,增加开发效率.(脏数据处理--是否有标识.是否有响应) 前端开发的对组件化开发应该都都很熟悉,我们就讲精华的部分: 首先我们需要输入下面的命令: npm install wepy-cli -g // 全局安装或更新WePY命令行工具 wepy new myproject // 在开发目录中生成Demo开发项目 cd myproject // 切换至项目目录 npm inst

小程序的wepy框架会生成后缀名为.wpy的文件,此文件用VScode打开时并不是高亮的,官方文档给我们提供了两种方案进行高亮 方案一:   1. 在 Code 里先安装 Vue 的语法高亮插件 Vetur.   2. 打开任意 .wpy 文件.   3. 点击右下角的选择语言模式,默认为纯文本.   4. 在弹出的窗口中选择 .wpy 的配置文件关联....   5. 在选择要与 .wpy 关联的语言模式 中选择 Vue. 方案二: 在VS Code编辑器设置中设置. //文件-首选项-设置-

一.简介 此扩展将Vue 2代码片段和语法突出显示添加到Visual Studio代码中. 这个插件基于最新的Vue官方语法高亮文件添加了语法高亮,并且依据Vue 2的API添加了代码片段. 支持语言 VUE(.vue) HTML格式(.html) 使用Javascript(.js文件) 打字稿(.TS) 帕格(.pug) 官网地址:https://marketplace.visualstudio.com/items?itemName=sdras.vue-vscode-snippets 二.安装

在这里只介绍自己经常使用的编辑器sublime 第一:安装node插件[出处:http://www.bubuko.com/infodetail-798008.html] 1.下载Nodejs插件,下载地址为:https://github.com/tanepiper/SublimeText-Nodejs 下载zip压缩包后解压,文件名改为Nodejs 2.打开Sublime Text3,点击菜单“Perferences” =>“Browse Packages”打开“Packages”文件夹,并将第

全局安装或更新WePY命令行工具 npm install wepy-cli -g 在开发目录中生成Demo开发项目 wepy new myproject 切换至项目目录 cd myproject 开启实时编译 wepy build --watch VS Code语法支持   1. 在 Code 里先安装 Vue 的语法高亮插件 Vetur.   2. 打开任意 .wpy 文件.   3. 点击右下角的选择语言模式,默认为纯文本.   4. 在弹出的窗口中选择 .wpy 的配置文件关联....