vue引入自己写的js文件
话不多说,直接上代码呀~
先来个结构图:
中规中矩的vue-cli就写了一个自己的js文件
那么我想要引入到vue组件里。
1.首先写我的js文件
2.引入到vue组件!!!一定要用{}把方法名拿过来
3.可以开心使用了
【关于引入第三方插件:简单的说一下三种方式】
一.可以cdn直接引入到index.html里,记得放在</body>前面哦
二.配置webpack :
1、首先在package.json
里加入,
dependencies:{
"jquery" : "^2.2.3"
}
2、安装依赖
npm install jquery --save-dev
3、在webpack.base.conf.js
里加入
var webpack = require("webpack")
4、在module.exports的最后加入
plugins: [ new webpack.optimize.CommonsChunkPlugin('common.js'), new webpack.ProvidePlugin({ jQuery: "jquery", $: "jquery" }) ]
5、然后一定要重新npm run dev
会报错:npm install --save !!vue-style-loader!css-loader
执行命令:npm install stylus-loader css-loader style-loader --save-dev
6、在main.js 引入就ok了
import $ from 'jquery'
3.如果这个插件是某个人写的并不能通过npm下载安装,怎么办?
参考:https://www.cnblogs.com/mengfangui/p/7552471.html
参考:http://blog.csdn.net/meishuixingdeququ/article/details/76338632
vue引入自己写的js文件的更多相关文章
- vue 调用常量的config.js文件
我遇到问题,就是有很多常量需要应用的项目里面.所以需要打算设置一个config.js文件 1.填写config.js 文件 //常量配置 //快递公司名单 对应的页面为: src/pages/othe ...
- vue中将验证表单输入框的方法写在一个js文件中(表达式验证邮箱、身份证、号码、两次输入的密码是否一致)
文章目录 1.实现的效果 2.编写的js文件(这里写在了api文件下) 3.在vue页面中引入(script) 4.页面代码 1.实现的效果 20220606_154646 2.编写的js文件(这里写 ...
- vue/cli项目添加外部js文件的一个方法
有一个util.js文件,内容如下 function Util () { ... } export default new Util() 可以在main.js里面通过import引入js import ...
- Vue中ESlint配置文件eslintrc.js文件详解
最近在跟着视频敲项目时,代码提示出现很多奇奇怪怪的错误提示,百度了一下是eslintrc.js文件没有配置相关命令,ESlint的语法检测真的令人抓狂,现在总结一下这些命令的解释,方便以后查阅. 默认 ...
- jquery与自己写的js文件冲突解决办法
先加载JQUERY,然后使用语句 jQuery.noConflict(); 再加载其他JS文件,后面在使用jQuery时都换下,如:$('#div') 换成 jQuery('#div'), 如果嫌j ...
- CI框架引入外部css和js文件
首先在项目根目录下建立assets文件夹,在这个文件夹下再建立css和js文件夹分别放置css和js文件 然后,在项目根目录下建立.htaccess文件 内容如下: RewriteEngine on ...
- 页面中引入带中文的JS文件乱码问题
1. WebConfig: <globalization requestEncoding="gb2312" responseEncoding="gb2312&quo ...
- eclipse3.7之后,在引入的jquery的js文件打红叉
使用Eclipse 3.7时,工程中加入jquery.xx.js文件,发现该文件出现错误提示(红×),但使用Eclipse 3.7以前的版本就不会出现这种提示.是因为Eclipse 3.7在.proj ...
- 在引入的css或者js文件后面加参数的作用
有时候可能会遇到js或者css文件引用后传递参数: css和js带参数(形如.css?v=与.js?v=) <script type=”text/javascript” src=”jb51.js ...
随机推荐
- 玲珑杯”ACM比赛 Round #19 B 维护单调栈
1149 - Buildings Time Limit:2s Memory Limit:128MByte Submissions:588Solved:151 DESCRIPTION There are ...
- sso单点登录的PHP实现(Laravel框架)
简单说一下我的逻辑,我也不知道我理解sso对不对. 假如三个站点 a.baidu.com b.baidu.com c.baidu.com a.baidu.com 作为验证用户登录账户. b和c作为客户 ...
- 2017国庆 清北学堂 北京综合强化班 Day1
期望得分:60+ +0=60+ 实际得分:30+56+0=86 时间规划极端不合理,T2忘了叉积计算,用解析几何算,还有的情况很难处理,浪费太多时间,最后gg 导致T3只剩50分钟,20分钟写完代码, ...
- ④ 设计模式的艺术-04.抽象工厂(Abstract Factory)模式
抽象工厂模式 用来生产不同产品族的全部产品.(对于增加新的产品,无能为力:支持增加产品族) 抽象工厂模式是工厂方法模式的升级版本,在有多个业务品种.业务分类时,通过抽象工厂模式产生需要的对象是一种非常 ...
- Intellij IDEA 快捷键整理(转)
Ctrl+Shift + Enter,语句完成 “!”,否定完成,输入表达式时按 “!”键 Ctrl+E,最近的文件 Ctrl+Shift+E,最近更改的文件 Shift+Click,可以关闭文件 C ...
- 开源中国愚人节网页变模糊的js blur代码
<![if !IE]> <script> /* * by moli */ $(document).ready(function(){ if(document.cookie.in ...
- 数组A - 财务管理
Larry graduated this year and finally has a job. He's making a lot of money, but somehow never seems ...
- js小记:对象、原型及原型链、面向对象编程
一.js对象 1.js对象 js对象是一种复合数据类型,它可以把多个(不同类型的)数据集中在一个变量中,并且给每个数据起名字. 2.对象与数组 对象的每个数据有对应的名字(属性名),我们通过叫名字访问 ...
- 【洛谷 P2764】 最小路径覆盖问题(最大流)
题目链接 首先有\(n\)条路径,每条路径就是一个点,然后尽量合并,答案就是点数-合并数. 套路拆点,源连入,出连汇,原有的边入出连. 最大流就是最大合并数,第一问解决. 然后怎么输出方案? 我是找到 ...
- 【leetcode 简单】第三题 回文数
判断一个整数是否是回文数.回文数是指正序(从左向右)和倒序(从右向左)读都是一样的整数. 示例 1: 输入: 121 输出: true 示例 2: 输入: -121 输出: false 解释: 从左向 ...