草庐IT

vue打包

全部标签

javascript - 测试用 browserify 打包的模块?

我正在为使用browserify管理的模块编写测试。这是我要测试的模块(具体我要测试calculateData):require('mapbox.js');varutils=require('./src/chart_utils');vardashboard={calculateData:function(data){//functionstotest}};我已经开始写这样的测试了:varexpect=require('chai').expect;varDashboard=require('../dashboard');//describe('Dashboard',function(){

javascript - 在 Vue.js 中使用 Flow.js

我正在尝试使用flow.js与vue.js但我遇到了让它在.vue文件中工作的问题。我运行了vueinitwebpack、npminstall-gflow-bin,然后是npminstall和npmrundev.我能够在我的.flowconfig中忽略我的node_modules中的错误文件,但是当我尝试将//@flow添加到我的src/main.js文件的顶部时,我得到了跟随错误src/main.js:33:importAppfrom'./App';^^^^^^^./App.Requiredmodulenotfound我已经尝试将//@flow符号添加到我的src/App.vue文件

javascript - 编写依赖父构建工具的 Vue 组件的正确方法

Iimaginethisproblemwouldapplytootherframeworksthathaveabitofaplugin/componentecosystemaboutthemthatrelyonspecificbuildtools(ReactcomponentswithJSX,etc).Vueisjustmyuse-case.我以单个.vue文件的形式编写了多个Vue组件,这些组件已发布到NPM。这些组件的package.json没有列出任何依赖项,因为它们本身旨在在使用webpack、vue-loader、sass-loader等的父项目中运行。Thisisanexa

javascript - [Vue 警告] : Invalid prop: type check failed for prop "X". 预期,得到字符串

给定这个Vue2组件:Vue.component('read-more',{props:{'text':String,'clamp':{type:String,default:'ReadMore'},'less':{type:String,default:'ReadLess'},'length':{type:Number,default:100}},template:`{{truncate(text)}}=length"@click="toggle()">{{clamp}}{{text}}=length">{{less}}`,methods:{truncate(string){if(s

javascript - 使用 Vue.js 的 Firebase 电话号码身份验证不起作用

我正在基于Webpacktemplate构建一个新的Vue.js应用程序.我有一个/sign-in路由,它加载一个名为SignIn的组件。我正在尝试使用FirebasePhoneNumberauthentication使用FirebaseSDK对我的用户进行身份验证。我已经使用npminstallfirebase安装了Firebase,并在我的main.js文件中对其进行了初始化,如下所示:/src/main.jsimportfirebasefrom'firebase';importVuefrom'vue';importAppfrom'./App';importrouterfrom'.

javascript - 使用 browserify 异步/延迟加载 Vue 组件

我试图在laravel项目中将许多Vue.js组件加载到我的app.js文件中(通过elixir使用browserify/vueify)。我不想一次加载每个组件,而是想在需要时使用vuerouter延迟加载各个vue组件。.我在哪里设置partitionbundlejson文件,它应该如何构建?目前,我将以下内容绑定(bind)到我的主要app.js文件中:importVuefrom'vue';importResourcefrom'vue-resource';importVueRouterfrom'vue-router';//ThesearethecomponentsthatIwish

javascript - 如何在 Vue.js 中测试计算属性?无法模拟 "data"

我想知道如何在Vue.js的单元测试中测试计算属性。我已经通过vue-cli(基于webpack)创建了一个新项目。例如这是我的组件:exportdefault{data(){return{source:[]}},methods:{removeDuplicates(arr){return[...newSet(arr)]}},computed:{types(){returnthis.removeDuplicates(this.source))}}}我试过这样测试it('shouldremoveduplicatesfromarray',()=>{constarr=[1,2,1,2,3]co

javascript - 是否保证在 webpack 或 rollup 模块打包过程中保留单例?

了解单例创建共享全局状态这一事实,在某些情况下我可能需要单例,例如reduxstore/state对象。如果我使用的是ES模块,我可以使用如下简单的代码来创建单例://a.js(singletonmodule)classA{}//Createsingletonexportconsta=newA();现在我可以在其他模块的任何地方使用这个实例化对象://b.js//Importsingletonimport{a}from'./a.js';console.log(a);//c.js-someothernestedfileimport{a}from'../../a.js';console.l

javascript - 使用 Vue.js 访问子组件中的 api 数据

我正在开发一个大型应用程序,在处理来self的API的数据并将其传递到我的子组件时遇到了很多麻烦。情况。我从父组件调用我的API,并通过prop将数据传递到我的子组件。子组件可以很好地显示数据,但我无法在子组件的就绪函数中访问数据。看看:https://jsfiddle.net/kmrfkynf/3/正如您在控制台中看到的那样,在子组件就绪函数中显示数据会给我一个空对象...ready:function(){console.log('itemsfromchildcomponent',this.items);}...但是子组件在我的重复中很好地渲染了对象。所以问题是子组件在父组件的API

javascript - 使用 Webpack 将 JSON 打包为纯 JSON 文件

我有一个网络应用程序需要一个配置JSON文件,其中包含端点和其他所需的启动参数。如果我使用json-loader,文件不是“真正的json”,它看起来像这样:module.exports={"name":"foo","key":true,};我想要的是普通的旧JSON,这意味着它可以作为部署过程的一部分进行解析和更改,然后再发送到将从中提供服务的Web服务器。另一种方法是使用文件加载器。然而,这意味着(尽管这是一项微不足道的任务)我必须自己编写代码来下载文件。我想让webpack处理这个并且可用。有没有一种方法可以要求一个JSON文件,它被编写为一个普通的JSON文件并在运行时导入?