laravel+vue组合的项目中引入ueditor(打包成组件形式)
前言:最近写东西需要用到ueditor,并且需要是在vue组件中引入。
(本博客默认你已经配置了laravel+vue的项目环境,如果还没有配置好的的小伙伴,可以看看我的另一篇博客,链接:
http://www.cnblogs.com/meng1314-shuai/p/7136049.html
)
1、下载editor
这个直接去ueditor的官网下载其PHP版本的就可以了,没什么好说的
2、移到项目目录中(主要讲如何放置配置文件和静态资源文件)
打开下载好的ueditor目录,如果版本没有错也没出什么问题,应该就会看到如下目录及文件
这里面:ueditor.all.js、ueditor.config.js、ueditor.parse.js以及lang/zh-cn/zh-cn.js 是我们需要拿来在vue中加载的配置文件,所以我直接放在了resources/assets/js目录下(当然这里我们推荐的是引入这些配置文件对应的.min.js的文件,如果有的话。。。还有放置的目录也可以自己定义,
不过这里我们为了方便区分和引入,所以就按前面说的目录来放了),像这样
当然,放置好了配置文件,剩下的四个目录我们就直接放在laravel默认的静态资源目录public/js下面,像这样:
3、定义公共的ueditor组件(方面多处引用)
这里同样为了方便引入,我们直接在ueditor的配置文件的同级目录下新建UEditor.vue组件
然后编写我们的ueditor组件,这里为了方便喜欢“偷懒”小伙伴们
laravel+vue组合的项目中引入ueditor(打包成组件形式)的更多相关文章
- 在vue项目中引入jquery
在vue项目中引入jquerycnpm install jquery --save在main.js中引入,加入下面这行代码:import 'jquery'注:有些项目是按需加载的,在main.js里面 ...
- 【vue】如何在 Vue-cli 创建的项目中引入 iView
根据vue项目的搭建教程,以下记录如何在Vue-cli创建的项目中引入iView. 1)iView的安装,在项目下使用 npm 安装iView cnpm install iview --save ...
- 【vue】如何在 Vue-cli 创建的项目中引入iView
根据vue项目的搭建教程,一下记录下如何在Vue-cli创建的项目中引入iView. 1)安装iView,在项目下 cnpm install iview --save 2 ) 在 webpack ...
- 在vue项目中引入阿里图标库小记
使用Vue技术栈开发不仅效率高,而且很友好,而且还有很多基于vue的UI框架,例如:element等,但是这类框架美中不足的是,图标太少.为了解决这个问题,不得不引入第三方字体库,今天以阿里图标库为例 ...
- vue项目中引入Sass
Sass作为目前成熟,稳定,强大的css扩展语言,让越来越多的前端工程师喜欢上它.下面介绍了如何在vue项目 中引入Sass. 首先在项目文件夹执行命令 npm install vue-cli -g, ...
- 前端学习笔记系列一:10整体移动vscode代码块、VSCode 使用 stylus,配置格式化设置、在vue项目中引入bootstrap
1.整体移动vscode代码块 凭借操作的经验我们能够轻松地知道将代码整体往右移只需选中代码按Tab键即可.其实往左移也很简单: 选中之后按下 shift+Tab键 即可. 2.VSCode 使用 s ...
- vue2.0中引入UEditor的一些坑。。。。
开发后台系统的时候,富文本编辑器肯定是必不可少的,然后呢~在天朝当然要属百度编辑器(UEditor)最成熟了,功能全面,文档齐全(相对),ui优美(...,对于程序员来说)等等许多方面(MMP,还不是 ...
- vue-cli创建的项目中引入第三方库报错 'caller', 'calle', and 'arguments' properties may not be...
http://blog.csdn.net/sophie_u/article/details/76223978 以在vue中引入mui第三方库为例: 虽然针对vue,有单独的vue-mui库可以使用,但 ...
- vue-cli项目中引入第三方插件
前言 最近有小伙伴问道如何在vue-cli项目中引入第三方插件或者库,例如如果想在项目中使用jQuery中的Ajax请求数据呢?或者我想使用Bootstrap框架呢?等等这些问题,本篇博客将带你学习如 ...
随机推荐
- 为什么很多人使用#define而不是const定义常量
众所周知,C语言一开始只有#define,C程序员用#define定义符号常量.但后来ANSI C加入了const限定符,而const应该比#define更好,为什么现在的C程序员还在大量使用#def ...
- JVM-4.类加载机制
目录 一.类加载的基础 二.类加载的过程 三.类加载器:分类 四.类加载器:双亲委托模型 五.类加载器:补充 六.初始化时机/主动引用和被动引用[关于实例初始化,参考<Java编程思想05-初始 ...
- nodeJs中npm详解
npm 是 Node.js 的模块依赖管理工具.作为开发者使用的工具,主要解决开发 node.js 时会遇到的问题.如同 RubyGems 对于 Ruby 开发者和 Maven 对于 Java 开发者 ...
- SQL Server使用导入导出向导导入超过4000个字符的字段的数据
在使用SQL Server导入导出向导导入数据的时候,我们经常会碰到某个单元格的数据超长而被截断报错的情况.本文针对这种场景给出相应的解决方案. 环境描述:SQL Server 2012,文件源: ...
- 夜神模拟器与HBuilder连接/cmd运行提示符/执行夜神模拟器命令/执行HBuilder命令
第一步:启动HBuilder和夜神模拟器 第二步:通过运行电脑命令CMD进入(电脑运行命令的快捷键是:windows键+R2.Ctrl键与Alt键之间的那个键就是windows键或者点击左下角开始图标 ...
- 利用Excel做一些简单的数据分析
先来几个原始数据的截图,如下所示: 示例图就举一个吧,因为这些数据量还挺大的,大概的总结了一下,这下列这几栏中不合规范的数据占比很大: (1)民族(经分析,在此表中所涉及到的民族分别为:汉族,满族,蒙 ...
- cordova 插件开发
从事基于cordova开发混合APP也快一年了,一直没有自己"亲自操刀"写一个插件,因为网上插件太丰富了,可耻了. 今天完整的记录一次插件开发. cordova环境6.4.0 第一 ...
- Cordova各个插件使用介绍系列(四)—canvas2ImagePlugin保存二维码到手机本地
详情链接地址:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/cordova-4-canvas2imageplugin/ 在前面几篇 ...
- node.js如何制作命令行工具(一)
之前使用过一些全局安装的NPM包,安装完之后,可以通过其提供的命令,完成一些任务.比如Fis3,可以通过fis3 server start 开启fis的静态文件服务,通过fis3 release开启文 ...
- 持续集成篇-- SonarQube代码质量管理平台的配置与使用
样例视频教程:http://www.roncoo.com/course/view/85d6008fe77c4199b0cdd2885eaeee53 一.SonarQube的配置(前提,先用admin用 ...