首页 > web前端 > uni-app > 正文

uniapp如何引入js文件

王林
发布: 2023-05-21 21:16:35
原创
7042人浏览过

随着uniapp的不断发展壮大,越来越多的开发者开始使用它来开发跨平台应用程序。在开发过程中,有时可能需要引入一些自己编写的js文件。本文将介绍使用uniapp如何引入js文件的方法。

一、在页面中引入js文件

  1. 在pages目录下找到需要引入js文件的页面(例如:index.vue)
  2. 在该页面的script标签中,使用如下代码引入js文件:
import xxx from '@/xxx.js' 
登录后复制

其中,'@' 符号表示项目根目录,xxx表示自己编写的js文件名称。如果该文件不在根目录下,则需要修改引入路径。

  1. 在代码中使用该js文件中的方法或变量,例如:
xxx.doSomething();
登录后复制

二、在组件中引入js文件

  1. 找到需要引入js文件的组件文件(例如:my-component.vue)
  2. 在该组件的script标签中,使用如下代码引入js文件:
import xxx from '@/xxx.js' 
登录后复制

同样,'@' 符号表示项目根目录,xxx表示自己编写的js文件名称。如果该文件不在根目录下,则需要修改引入路径。

  1. 在组件代码中使用该js文件中的方法或变量,例如:
mounted() {
  xxx.doSomething();
}
登录后复制

三、在全局中引入js文件

易森网络企业版
易森网络企业版

如果您是新用户,请直接将本程序的所有文件上传在任一文件夹下,Rewrite 目录下放置了伪静态规则和筛选器,可将规则添加进IIS,即可正常使用,不用进行任何设置;(可修改图片等)默认的管理员用户名、密码和验证码都是:yeesen系统默认关闭,请上传后登陆后台点击“核心管理”里操作如下:进入“配置管理”中的&ld

易森网络企业版 0
查看详情 易森网络企业版
  1. 在项目根目录下,找到vue.config.js文件
  2. 在该文件中添加如下代码:
configureWebpack: {
  externals: {
    'xxx': 'xxx'
  },
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src')
    }
  }
}
登录后复制

其中,'xxx': 'xxx' 表示需要引入的js文件名,第一个'xxx'是该文件在项目中的名称,第二个'xxx'是在全局中的名称;'@' 符号也表示项目根目录。

  1. 在需要使用该js文件的地方,使用如下代码引入:
window.xxx.doSomething();
登录后复制

四、总结

通过以上三种方法,我们可以在Uniapp中引入自己编写的js文件,并在页面、组件或全局中使用。在编写js文件时,需要注意命名和路径的规范,以免造成引入失败或代码混淆的情况。

以上就是uniapp如何引入js文件的详细内容,更多请关注php中文网其它相关文章!

最佳 Windows 性能的顶级免费优化软件
最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移,垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是,许多工具可以让 Windows 保持平稳运行。

下载
来源:php中文网
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn
最新问题
热门推荐
开源免费商场系统广告
热门教程
更多>
最新下载
更多>
网站特效
网站源码
网站素材
前端模板
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新 English
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号 技术交流群
PHP中文网订阅号
每天精选资源文章推送
PHP中文网APP
随时随地碎片化学习

Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号