如何在vue项目的package.json插件中使用本地文件，不走node_module打包逻辑

已于 2024-04-16 08:30:34 修改
阅读量588 收藏
点赞数 16
文章标签： vue.js javascript
于 2024-04-15 15:19:45 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ivan5277/article/details/137782194
版权

在src同级目录新建libs目录存放你的插件文件夹。

在这里插入图片描述

![](https://img-blog.csdnimg.cn/direct/05eec4ee515e47ce8df77277c389271d.png

package.json文件：将插件路径改为项目根目录相对路径。

在这里插入图片描述

page页面内引用插件后，尽情使用你的插件。

在这里插入图片描述

天下一场夢
关注
  • 16
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
file-dependencies:允许在 package.json 中指定 fileDependencies 来获取本地和远程文件
06-25
#fileDependencies 支持 package.json 此模块使用附加属性扩展package.json ： fileDependencies 。 使用fileDependencies可以根据位于文件系统中其他位置或 Internet 上某个位置的文件来表达项目依赖项。 如果一个节点项目需要一些不是来自 NPM 的额外库或二进制文件——也许它们是用其他语言开发的，则可以将它们作为文件依赖项获取。 ＃例子 { "name": "file-dependencies", "version": "1.0.0", "author": "Massimiliano Marcon <me> (http://marcon.me)", "license": "MIT", "dependencies": { "q": "^1.1.2",
package.json中main，module，exports三种方式的使用，自定义入口文件index.js
最新发布
05-07
对于Vue.js项目，尤其是由`@vue/cli`生成的Vue3项目，`package.json`中的`main`、`module`和`exports`字段用于指定不同环境下的入口文件，这有助于优化加载和打包过程。本文将深入探讨这三种方式的使用以及如何...
vue项目中使用本地包
weixin_41127362的博客
05-13 1272
"dependencies": { "ai-ui": "file:packages/ai-ui-1.3.4.tgz", "axios": "^0.26.1", "better-scroll": "^2.4.2", "core-js": "^3.6.5", "element-ui": "2.13.0", "ifish": "file:./packages/ifish-0.3.1.tgz", "js-cookie": "^3.0.1", "v...
vue-cli3项目中引入本地文件
ddyy2695734664的博客
03-17 5063
组件内部使用某本地json数据： 之前用地图的json文件的时候，是在组件内部中通过import chinaData from ‘@/assets/china.json’，当然json文件直接放到了src的assets文件夹下，组件内直接就拿到了chinaData地图数据可以用 public中的html文件直接用script标签引入本地文件 但是这个本地文件是jquery和jquery.Supe...
Vue项目引入本地JSON文件
qq_57671914的博客
11-21 3984
首先将JSON文件移动到assets目录下 通过import将其引入 最后直接引用即可
package.json中的本地依赖项
CHCH998的博客
05-18 4714
I want to do something like this, so npm install also installs the package.json of ../somelocallib
VUE之package.json文件
Sunshine_366的博客
03-19 1262
package.json包括项目的依赖模块、配置信息（name/version/description/author/private等），是一个大的JSON对象，对象中每一项代表一项设置。npm install命令根据此配置文件自动下载所需模块存放在node_modules中，满足项目运行或开发的环境。package.json文件可以手工编写，也可以使用npm init命令自动生成基本配置。
vue3+vite本地json文件打包与读取时遇到的问题
m0_72072486的博客
04-19 1258
若是放在src文件夹下在打包的时候本地json文件打包不进去。推荐把本地json文件放在public文件夹中。本地json数据在vue3中可以直接读取。
vue3.x中使用cesium，vue3.x+Cesium
05-04
以下是关于在Vue3.x中使用Cesium的知识点： 1. **Vue CLI集成**: 首先，你需要通过Vue CLI创建一个新的项目。执行`vue create my-vue3-cesium-project`命令，然后选择自定义配置，这将允许你手动调整项目结构和配置...
vue完成项目后,打包成静态文件的方法
10-18
现在，你已经了解了如何使用 Vue CLI 打包项目并利用 Node.js 进行本地调试。这种方法不仅方便在本地预览，还能在部署前对打包后的应用进行测试，确保一切正常。在实际开发中，你可能还需要考虑其他因素，比如优化、...
如何在基于vue-cli的项目自定义打包环境
10-17
例如，我们可以在`webpack`配置文件中使用`webpack.DefinePlugin`来根据`NODE_ENV`的值定义不同的变量： ```javascript // webpack.config.js const webpack = require('webpack'); ... plugins: [ new webpack....
深入浅析vue中cross-env的使用
12-03
在大多数Windows命令行中在使用NODE_ENV = production设置环境变量时会报错。同样，Windows和Linux命令如何设置环境变量也有所不同。 使用 cross-env 可以设置在不同的平台上有相同的NODE_ENV参数。 使用 安装 ...
vue 导入本地的文件
weixin_43055905的博客
03-04 1591
1. 引用图片 document.body.style.backgroundImage = 'url(' + require('@/assets/delayBack.png') + ')' 2. 引用js文件 vue页面中导入 import mapURL from '@/api/url/mapURL.js' 使用 console.log(mapURL.url) 3. 引用json文件 ...
如何在项目中引用本地的npm包
u010227042的博客
03-19 687
/将 ./path/to/dependency1 和 ./path/to/dependency2 替换为实际依赖项目录的相对路径。2. 不要指定包名的版本号，而是指定依赖项所在的本地路径。本地路径应该是相对于当前项目目录的路径。// 正常的dependencies中的依赖包引用的是你npm所设置的镜像源所对应的版本号。1. 打开您的 package.json 文件，找到 dependencies 部分。package.json中配置引用本地依赖包。// 如何想要引用本地依赖包就要写成以下形式。
vue.js学习笔记(二)：如何加载本地json文件
weixin_34128534的博客
10-15 791
在项目开发的过程中，因为无法和后台的数据做交互，所以我们可以自建一个假数据文件(如data.json)到项目文件夹中，这样我们就可以模仿后台的数据进行开发。但是，如何在一个vue.js 项目中引入本地的json文件呢，下面就将步骤贴出来。(此时项目是由webpack打包而成)。 整个项目是由webpack打包而成，具体步骤上网查找。具体项目结构如下： 1：我们找到bulid>dev-...
详解 Vue 目录及配置文件之 package.json
Demo_Null
07-26 6141
j简单记录一下 package.json 里面都是啥以及 npm 版本号怎么看。
vue中如何引入插件并使用
weixin_46769087的博客
07-05 1036
ES6模块的引入与使用。
【前端Vue】Vue安装的四种方式：引用Vue.js文件、使用CDN方法、利用npm方法、命令行工具CLI以及区分Web App、Native App、Hybrid App
量化Mike
11-08 2276
Vue.js不支持IE 8及以下版本，因为它使用了IE 8无法模拟的ECMAScript 5特性，但它支持所有兼容ECMAScript 5的浏览器。
Cannot find module 'vue-loader/package.json'
05-20
这个错误通常是由于缺少vue-loader模块所致。您需要通过npm或yarn安装vue-loader模块。 请尝试运行以下命令来安装vue-loader： 使用npm： ``` npm install vue-loader --save-dev ``` 使用yarn： ``` yarn add vue-loader --dev ``` 如果您已经安装了vue-loader但仍然遇到此错误，请尝试删除node_modules目录并重新安装依赖项： 使用npm： ``` rm -rf node_modules npm install ``` 使用yarn： ``` rm -rf node_modules yarn install ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值