小编dan*_*man的帖子

gulp-connect和gulp-open文件无法通过服务器加载

我正在尝试运行Web服务器并通过gulp-connect和gulp-open打开HTML文件.

服务器正在运行,html正确打开但不是通过服务器而是作为HDD中的文件打开.

在URL地址栏上,我可以看到:"file:/// Users/...."而不是" http:// localhost:9000 / "

有谁知道可能是什么问题?

谢谢你的帮助

"use strict";

var gulp = require('gulp');
var gulpConnect = require('gulp-connect'); // run a local dev server
var gulpOpen = require('gulp-open'); // open a URL in the browser

var config ={
    port:'9000',
    baseDevUrl:'http://localhost',
    paths: {
        html: './src/*.html',
        dist:'./dist'
    }

};
// start a local development server

gulp.task('connect',function(){

    gulpConnect.server({
        root:['dist'],
        port: config.port,
        base: config.baseDevUrl,
        livereload:true
    });

});

gulp.task('open',['connect'],function(){
       gulp.src('dist/index.html')
           .pipe(gulpOpen('',{ url: config.baseDevUrl +':'+ config.port +'/', app:'google chrome'}));
});

gulp.task('html',function(){
    gulp.src(config.paths.html)
        .pipe(gulp.dest(config.paths.dist))
        .pipe(gulpConnect.reload()); …
Run Code Online (Sandbox Code Playgroud)

gulp-connect

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

为什么"010"等于8?

我的简单问题是为什么:

System.out.println(010|4);
Run Code Online (Sandbox Code Playgroud)

打印"12"?我理解按位OR运算符,但为什么"010"等于8?这绝对不是恭维2的通知,那么如何解码这个数字呢?

java format binary bit-manipulation

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

在Chart.js段中嵌入唯一标识符?

我想通过允许用户双击切片来向下钻取来使我的饼图交互.我相信这样做的方法是在画布上创建一个onclick处理程序,并用于getSegmentsAtEvent()确定单击了哪个切片.

调用返回的段数据getSegmentsAtEvent()可能不明确.以下是返回数据的示例:

[{
    "circumference": 4.1887902047863905,
    "endAngle": 8.901179185171081,
    "fillColor": "#FF5A5E",
    "highlightColor": "#FF5A5E",
    "innerRadius": 0,
    "label": "Red",
    "outerRadius": 99.5,
    "showStroke": true,
    "startAngle": 4.71238898038469,
    "strokeColor": "#fff",
    "strokeWidth": 2,
    "value": 300
}]
Run Code Online (Sandbox Code Playgroud)

这些领域中,只有value,fillColor,highlightColor,和label由我提供的,其中没有必然是独一无二的.我可以确保它label是独一无二的,但这可能会使人们的可读性降低.

我已经尝试在我传入的数据中添加一个额外的属性(例如"id")Pie(),但是当我从这个调用中获取段数据时它被剥离了.有没有办法为每个段添加一个属性,我可以使用它来确定它们,而不会使label字段超载?

javascript chart.js

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

Webpack加载字体

我在React元素中有这个代码:

require('../../Style/fonts/SomethingStrange.ttf')
Run Code Online (Sandbox Code Playgroud)

在我的Webpack.config中:

{ test: /\.(ttf|otf|eot|svg|woff(2)?)(\?[a-z0-9]+)?$/, 
      loader: 'file-loader?name=fonts/[name].[ext]' }
Run Code Online (Sandbox Code Playgroud)

问题:我的网页上没有字体...

Webpack不让我自动要求字体吗?我是否需要编程其他任何东西来加载字体?

javascript reactjs webpack

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

无法对使用$ window的Angular指令进行单元测试

我已经为各种Angular(1.4.7)指令进行了大量的工作单元测试,我正在使用Karma,Jasmine和Sinon进行测试.

我正在尝试为新指令添加单元测试,这是我目前唯一使用的指令,$window但我在控制台输出中看到了一个神秘的错误:

TypeError:'undefined'不是对象(评估'this.proxy.toString')

此错误来自sinon.js第2372行.

我在指令单元测试中做了所有'正常'的事情,比如创建一个伪指令作为属性的伪元素:

testElement = document.createElement('div');
testElement.setAttribute('data-my-directive');
document.body.appendChild(testElement);
Run Code Online (Sandbox Code Playgroud)

并编译指令:

$compile(testElement)($scope);
Run Code Online (Sandbox Code Playgroud)

我正在$provide尝试模拟$window对象:

module('app', function ($provide) {
    $provide.value('$window', { id: 'test' });
});
Run Code Online (Sandbox Code Playgroud)

但是一旦我尝试$window在被测试的文件中使用,就会抛出上面显示的错误.

正如我所说,我对其他指令,服务和控制器进行了一系列其他单元测试按预期工作,因此所有内容都可以正确设置.这只是这个特殊的测试.

有任何想法吗?

javascript sinon angularjs karma-runner

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

打字稿中的导入与需求

当我浏览Angular2文档时,我在这里遇到了下面的代码.

SRC/polyfills.ts

import 'core-js/es6';
import 'core-js/es7/reflect';
require('zone.js/dist/zone');

if (process.env.ENV === 'production') {
 // Production
} else {
 // Development
Error['stackTraceLimit'] = Infinity;
require('zone.js/dist/long-stack-trace-zone');
}
Run Code Online (Sandbox Code Playgroud)

在上面的代码中,我们可以看到有两个importrequire语句.

"core-js"和"zone.js"都是节点模块.

我的问题是; 为什么import用于core-js和require"zone.js",有什么特别的原因吗?

node.js typescript

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

为什么documentFragment不比重复DOM访问快?

我总是认为,不是为了性能原因而反复触摸DOM,我们应该使用a documentFragment来附加多个元素,然后将片段附加到文档中一次,而不是一次又一次地重复添加新元素进入DOM.

我一直在尝试使用Chrome的开发工具来分析这两种方法,使用此测试页面:

<button id="addRows">Add rows</button>
<table id="myTable"></table>
Run Code Online (Sandbox Code Playgroud)

测试1使用此代码向表中追加50000个新行:

let addRows = document.getElementById('addRows');
addRows.addEventListener('click', function () {
    for (let x = 0; x < 50000; x += 1) {
        let table = document.getElementById('myTable'),
            row = document.createElement('tr'),
            cell = document.createElement('td'),
            cell1 = cell.cloneNode(),
            cell2 = cell.cloneNode(),
            cell3 = cell.cloneNode();

        cell1.textContent = 'A';
        cell2.textContent = 'B';
        cell3.textContent = 'C';

        row.appendChild(cell1);
        row.appendChild(cell2);
        row.appendChild(cell3);
        table.appendChild(row);
    }
});
Run Code Online (Sandbox Code Playgroud)

在Chrome的时间轴工具中录制时单击按钮会产生以下输出:

重复的DOM交互

测试2使用此代码:

let addRows = document.getElementById('addRows');
addRows.addEventListener('click', function () {
    let table = document.getElementById('myTable'),
        cell = …
Run Code Online (Sandbox Code Playgroud)

javascript performance dom

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

单页应用程序(SPA)中的命名锚点

在SPA中,使用Sammy.js等导航框架,我如何在页面命名锚点中使用页面内导航?

例如,假设我有一条路线,例如localhost/myapp/#/somerecord/1应用程序加载一些 id = 1的记录.

然而,某些记录真的很复杂而且很长.我希望能够使用命名锚跳转到某个部分.

假设一个文章元素被定义为<article id=section-d> ... </article>,我只是链接到<a href=#section-d>Section D</a>技术上工作,但URL读取localhost/myapp/#section-d,这打破了导航堆栈.点击后退按钮可以让我回到顶部localhost/myapp/#/somerecord/1并且不会跳回到顶部.

首选操作是跳回到顶部或上一页.有关如何实现这一目标的任何想法?

html sammy.js single-page-application

6
推荐指数
1
解决办法
4041
查看次数

文件路径中双星(**)的含义

当我在路径上遇到**时,我正在阅读Stack Overflow上的内容,例如:

src/js/**/*.js
Run Code Online (Sandbox Code Playgroud)

我只是想问一下,用一个单词"递归"是适合这个,所以最后准备这个"everydir recursive"为"**"并感觉我终于理解了,拜托?!

javascript path

6
推荐指数
2
解决办法
4060
查看次数

未捕获的TypeError:无法设置仅具有getter的#<HTMLElement>的属性offsetWidth

我正在使用AngularJS开发一个Web应用程序.我有一个错误,从无处出现,它工作正常,我真的不知道为什么它不再工作.

所以它在一个指令中,我尝试offsetWidth在指令html模板中设置元素的属性.由于我真的不知道它可能来自何处,我将为您提供我的指令和模板的完整代码.该指令创建一个app按钮并处理其对点击的视觉效果.这是$element[0].offsetWidth = $element[0].offsetWidth;触发错误的线.(这是重启动画的技巧)

我再说一遍,这段代码工作正常,我几乎可以肯定我没有做任何改动.我正在使用Chrome进行调试,也许它来自它?

错误: Uncaught TypeError: Cannot set property offsetWidth of #<HTMLElement> which has only a getter

指示:

'use strict';

XVMApp.directive('appButton', ['$location', function($location){
    return {
        restrict: 'E',
        replace: true,
        scope: {
            img: '@',
            fillPercent: '@?',
            target: '@?'
        },
        link: function ($scope, $element) {

            // Image percentage fill button
            if($scope.fillPercent === undefined) $scope.fillPercent = '100';

            // Click event
            $element.on('click', function() {

                // Url target
                if($scope.target !== undefined){
                    $scope.$apply(function() {
                        $location.path($scope.target);
                    });
                }

                // …
Run Code Online (Sandbox Code Playgroud)

javascript web-applications angularjs angularjs-directive

5
推荐指数
2
解决办法
7899
查看次数