小编Lou*_*uis的帖子

如何在Webpack中禁用捆绑以进行开发?

在我的网络应用程序中,我使用RequireJS按需异步加载我的javascript文件.这对dev很有用 - 在调试我的应用程序时,我可以看到哪个脚本依赖于它们的加载顺序.这简化了调试.

后来我切换到Webpack,因为它更容易配置,更容易维护.所以Webpack现在为我生成包含我的javascript代码的很好的包.这非常有效,但我想要的是模仿我之前的DevJS配置.

当我开发我的应用程序时,我希望Webpack生成一些简单的入口点(就像在RequireJS中一样),它将通过"require"引用逐个加载我的javascript文件.同时,当我将应用程序部署到服务器时,我仍然希望Webpack执行正常的捆绑.

这有可能实现吗?

javascript deployment requirejs bundling-and-minification webpack

11
推荐指数
1
解决办法
4532
查看次数

当我尝试运行测试时,获得"不匹配的匿名define()模块..."

我正在尝试使用requirejs配置我的业力茉莉花单元测试.但每次我运行它,我得到以下错误:

Chrome 34.0.1847 (Mac OS X 10.9.2) ERROR
Uncaught Error: Mismatched anonymous define() module: function (angular){

 describe('Unit: Testing RequireJS', function(){
  var ctrl;
  var scope;
  var rootScope;

  beforeEach(angular.mock.module('wsaApp'));

  beforeEach(angular.mock...<omitted>...ch
Run Code Online (Sandbox Code Playgroud)

以下是differenr文件: spec文件:

define(['angular'], function(angular){

describe('Unit: Testing RequireJS', function(){
   var ctrl;
   var scope;
   var rootScope;

beforeEach(angular.mock.module('wsaApp'));

beforeEach(angular.mock.inject(function($rootScope){
    scope = $rootScope.$new();
    rootScope = $rootScope;
}));

});
});
Run Code Online (Sandbox Code Playgroud)

main.js

require.config({

paths: {
    /* ABC order */
    'angular': 'vendor/angular/1.2.0/angular.min'
},
shim: {
    'angular': { exports: 'angular' },

    'app/controllers': { deps: ['angular'] }
}
});
Run Code Online (Sandbox Code Playgroud)

测试main.js

// …
Run Code Online (Sandbox Code Playgroud)

requirejs angularjs karma-runner karma-jasmine

10
推荐指数
1
解决办法
1万
查看次数

获取使用almond.js的RequireJS异步插件

我阅读下面的文章关于如何获取谷歌地图,并gmaps.js与RequireJS工作.但是,当我构建我的项目时,RequireJS与Almond交换.在上面的文章中,它指出Almond不能使用RequireJS异步插件.如果没有async插件,Google的依赖项就不会被加载,并会gmaps.js抛出错误.

有没有办法解决这个问题,仍然在使用Almond而不是RequireJS的项目中加载Google地图代码?

javascript google-maps requirejs almond

9
推荐指数
1
解决办法
946
查看次数

can-model无法从.json文件中获取数据

我试图在canjs中使用AMD实现MVC.为此,我使用requirejs.这是我的domains.json文件:

[            
"1":{"uid":     "1","urls": "domain1.abc.com"},
"2":{"uid":    "2","urls": "domain2.abc.com"},
"3":{"uid":    "3","urls": "domain3.abc.com"}
]
Run Code Online (Sandbox Code Playgroud)

这是我的domainModel:

define(['can'], function(can){
  SearchModel= can.Model({
     id: 'uid',
     findAll: 'GET /domains.json'
  },{})
  return SearchModel;
})
Run Code Online (Sandbox Code Playgroud)

这是我的控制器:

define(['can','jquery'],function(can,$){
 domainController=can.Control({defaults:{view:"../view/search.hbs" }},           
  {
    init : function(element,options){   
        this.element.html(can.view(this.options.view,{
            searchlist : this.options.search
        }))
    }
});
return domainController;
} 
Run Code Online (Sandbox Code Playgroud)

这是我的主要js:

equirejs(['can','controller/domainController','model/domainModel'],
 function(can, domainController,domainModel) {
   var Application = can.Control.extend({
    defaults :{ }
   },{  
        init: function(element,options){
         console.log('loaded');
         domainModel.findAll({}, function(domains){
            domainObject:{searchdomains : domains}
                 new domainController('#search',domainObject)
            });
        }
    })
return Application;
});
Run Code Online (Sandbox Code Playgroud)

我正在寻找我的代码.我把断点.在模型断点上我没有在chrome devtools中获取局部变量的值.

url属性具有'undefined/{id}'值,findAll方法具有四个属性,即参数,调用者,长度和名称,其值分别为null,null,0和""

我通过在浏览器上浏览localhost来检查我的模型网址,这是正确的.那么为什么模型无法获取json文件的值?

javascript json requirejs canjs canjs-model

9
推荐指数
1
解决办法
228
查看次数

如何从mocha.opts文件中正确地要求模块

我正在使用expect.js库和我的mocha单元测试.目前,我要求每个文件的第一行上的库,如下所示:

var expect = require('expect.js');

describe('something', function () {
    it('should pass', function () {
        expect(true).to.be(true); // works
    });
});
Run Code Online (Sandbox Code Playgroud)

如果可能的话,我想从每个文件的第一行删除样板需求代码,并让我的单元测试神奇地了解expect.我以为我可以使用mocha.opts文件来做到这一点:

--require ./node_modules/expect.js/index.js
Run Code Online (Sandbox Code Playgroud)

但是现在我在运行测试时遇到以下错误:

ReferenceError:未定义expect

这似乎是有道理的 - 它如何知道expect我的测试中的引用是指expect.js库导出的内容?

期望库肯定会被加载,好像我将路径更改为不存在的东西然后mocha说:

"错误:找不到模块'./does-not-exist.js'"

有什么方法可以实现我想要的吗?如果可能有帮助的话,我正在从gulp任务中运行我的测试.

javascript require mocha.js node.js gulp

9
推荐指数
1
解决办法
9715
查看次数

在活动时保留节点应用程序的数据

我是节点应用程序,我需要保留数据(到节点应用程序还活着),它将服务于用户请求,(我不想为每个请求计算/解析它,所以我这样做了一次......),当节点应用程序已关闭我不再需要此数据.

我发现以下(这是有效的)但不确定这是最好的方法,如果有的话有什么缺点.

这就是我使用的工作方式

require.cache.persist.myData = myData;
Run Code Online (Sandbox Code Playgroud)

我用express表示节点

javascript require node.js express

8
推荐指数
2
解决办法
2974
查看次数

使用JSDOM模拟在线/离线

我们正在编写离线第一个应用程序基础知识的教程,并使用带磁带的JSDOM来测试我们的代码.在我们的代码中,我们更新DOM,以便通过将事件监听器附加到窗口并监听"在线"/"离线"事件,将文本节点从"在线"更改为"离线",反之亦然,并navigator.onLine初始化文本到在线/离线.像这样:

// get the online status element from the DOM
var onlineStatusDom = document.querySelector('.online-status');
// navigator.onLine will be true when online and false when offline. We update the text in the online status element in the dom to reflect the online status from navigator.onLine
if (navigator.onLine) {
  onlineStatusDom.innerText = 'online';
} else {
  onlineStatusDom.innerText = 'offline';
}

// we use the 'online' and 'offline' events to update the online/offline notification to the user
// in IE8 the offline/online …
Run Code Online (Sandbox Code Playgroud)

javascript testing node.js jsdom

8
推荐指数
1
解决办法
363
查看次数

将变量传递给 require.context?

我需要一个带有 webpack 的目录中的所有文件,如下require.context所示:

export default class Svg {
    constructor() {
        const icons = require.context('example/images', true, /\.svg$/);
    }
}
Run Code Online (Sandbox Code Playgroud)

这工作正常,但我想将路径传递给我的构造函数,并require.context使用构造函数值(如果给定)或默认值(如果未给定)设置路径。

使用这样的变量会导致错误:

const icons = require.context(path, true, /\.svg$/);
Run Code Online (Sandbox Code Playgroud)

./src/Svg.js
11:20-27 中的警告关键依赖项:require 函数的使用方式无法静态提取依赖项

有没有办法解决这个问题,或者我只是在这里滥用 require.context 功能?

javascript webpack webpack-dev-server webpack-2

8
推荐指数
1
解决办法
2435
查看次数

如何在没有webpack dev服务器的情况下使用webpack进行开发?

我目前正在使用require.js开发,所以我可以快速迭代(更改文件,刷新页面,之间没有构建步骤),但我使用它webpack作为构建工具,因为它优于r.js.我想完全摆脱require.js并在开发中使用webpack作为脚本加载器.我知道这正是webpack dev server为了什么,但我特别不想使用它.

理想情况下,我只需要包含某种webpack加载器<script>,将其指向我的webpack.js构建配置,然后让它完成工作.

javascript build node.js webpack

7
推荐指数
1
解决办法
8860
查看次数

访问AngularJs指令控制器

我在使用jasmine和karma testrunner进行单元测试的指令访问我的控制器时遇到了一些问题.该指令如下所示:

指示

angular.module('Common.accountSearch',['ngRoute'])

    .directive('accountSearch', [function() {
        return {
            controllerAs: 'ctrl',
            controller: function ($scope, $element, $routeParams, $http) {

                this.setAccount = function () {
                    var response = { AccountId : $scope.ctrl.searchedAccount.AccountId }
                    $scope.callback(response)
                }


                this.getAccounts = function(searchText){
                    return $http.get('/api/CRMAccounts', {
                        params: {
                            retrievalLimit: 10,
                            search: searchText
                        }
                    }).then(function(response){
                        return response.data;
                    });

                }

            },
            scope : {
                config : '=',
                values : '=',
                callback : '='
            },
            templateUrl : '/common/components/account-search/account-search.html',
            restrict : 'EAC'
        }
    }]);
Run Code Online (Sandbox Code Playgroud)

这是测试用例文件到目前为止我认为所有都是正确的(我希望):

测试用例文件:

    describe("Account search directive logic tests", …
Run Code Online (Sandbox Code Playgroud)

javascript unit-testing jasmine angularjs karma-runner

7
推荐指数
2
解决办法
3958
查看次数