导航:首页 > 编程语言 > vue引用非cmdjs文件

vue引用非cmdjs文件

发布时间:2023-09-10 04:23:07

㈠ vue引用public中的js文件

由于一些演示,需要对编码名称等可快速进行修改,需要页面方便配置。由于build后的vue项目基本已经看不出原样,因此需要创建一个文件,并在打包的时候不会进行编译。

例如config.js定义了一个变量叫config,并在index.html页面引入后,那么在页面任何一处地方都可以直接使用。
config.js:

index.html:

页面使用:

在开发环境中,我在public下创建了config.js文件,并且用export default方法进行导出。在页面使用的地方使用import config from XXX进入引入。开发过程中,没有出问题,但是在打包发布以后,发现修改config文件并不生效。

经过排查才意识到:不打包编译的js文件不识别es6语法,并且不应该使用import方法进行引入,应该按照原生的js文件进行使用。

原文地址: https://www.cnblogs.com/luoxuemei/p/11926472.html

㈡ 如何在.vue文件中引入外部js

Vue 的 createElement 方法,简单的封装一个组件解决问题。

解决方法
第一版代码(直接在操作 Dom )如下:
export default {
mounted() {
const s = document.createElement('script');
s.type = 'text/javascript';
s.src = 'https://g.alicdn.com/dingding/dinglogin/0.0.2/ddLogin.js';
document.body.appendChild(s);
},
}
使用 createElement 方法:
export default {
components: {
'dingtalk': {
render(createElement) {
return createElement(
'script',
{
attrs: {
type: 'text/javascript',
src: 'https://g.alicdn.com/dingding/dinglogin/0.0.2/ddLogin.js',
},
},
);
},
},
},
}
// 使用在页面中调用
终极方案
通过封装一个组件 remote-js 实现:
export default {
components: {
'remote-js': {
render(createElement) {
return createElement('script', { attrs: { type: 'text/javascript', src: this.src }});
},
props: {
src: { type: String, required: true },
},
},
},
}
使用方法:
<remote-js src="https://g.alicdn.com/dingding/dinglogin/0.0.2/ddLogin.js">remote-js>

㈢ vue文件里面怎么引用外部的js文件

  1. 首先。我们要改造我们要映入的外部js文件,改成下面这个格式。主要是专红色方块内部代码,我属们需要将我们的模块“抛出”,让人能获取到以下及相应代码:

㈣ 关于Vue-cli引入外部js资源文件失败的一点思路

首先申明我是window系统下Vue-cli 4.5.3版本,脚手架整体基于vue2内核。

1.正常js文件如果有使用export向外暴露对象,将js放在src/assets都是可以通过import直接引入。但有有些情况下我们需要导入第三方的js文件,例如近期我在做的阿里云点播视频上传SDK,包括最近在学习的ThreeJs,如果单单只是在public中index.html通过<script src="https://cdn.bootcss.com/three.js/92/three.js"></script>引入,是不够的携扰还需要在具体vue页面引入:辩闷旦

这也是我尝试两天才成功,走了些弯路,希望帮助到有同样问题的打工人,共勉罩宴!

㈤ 请教如何在vue中引入自己写的js文件

比如说我在src/util下面有一个rem.js的文件,写成自执行函数
(function(doc, win) {
var docEl = doc.documentElement,
resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',
recalc = function() {
var clientWidth = docEl.clientWidth;
if (!clientWidth) return;
docEl.style.fontSize = (clientWidth / 12) + 'px';
};
if (!doc.addEventListener) return;
win.addEventListener(resizeEvt, recalc, false);
doc.addEventListener('DOMContentLoaded', recalc, false);})(document, window);然后在main.js中引用import './util/rem',然后每个路内由都运行起来容了

㈥ vue怎么导入自己写的js文件

1. 首先我们要改变复我们要映入的外部制js文件,改成以下这个格式。

阅读全文

与vue引用非cmdjs文件相关的资料

热点内容
linux连接ftp 浏览:512
es文件浏览器视频笔记 浏览:874
mac无法打开描述文件 浏览:134
什么软件打文件 浏览:53
数据库无数据变成0 浏览:899
名企笔试如何刷编程题 浏览:49
js跳到页面某地 浏览:550
jsp展示clob字段 浏览:779
nyx在网络上是什么意思 浏览:145
乐播农业app是什么 浏览:530
编程框架如何开发 浏览:136
金庸群侠传3修改代码 浏览:712
检察院的文件类别有哪些 浏览:793
怎么把九游残留数据删除 浏览:828
有什么女生主动聊天的app 浏览:436
有哪些可以督促自己的app 浏览:244
用USB传输视频文件夹显示为空 浏览:710
恢复文件软件免费版手机 浏览:648
lg怎么隐藏文件 浏览:836
苹果免费读书app推荐 浏览:497

友情链接