小编zok*_*zok的帖子

究竟什么是未来中的package.json依赖意味着什么呢？

"dependencies": {
  "react": "^15.4.2",
  "react-dom": "^15.4.2",
  "react-router-dom": "next"
}

例如,当使用Yeoman生成器启动项目时generator-gulp-webapp,您将获得package.json包含所有依赖项的文件.

最好先更新这些依赖关系的全部或任何(例如:gulp-useref,gulp-ruby-sass,gulp-bower-files,等)？做或不做的含义是什么？

是否可以在 VSCode 中预览 JavaScript 中的 SVG？

有一些插件可以在 VSCode 中预览 SVG 文件，但如果它们位于 JavaScript 或 React 组件中怎么办？或者，如果对象中有复合路径列表。

还有像 Storybook 这样的工具，但如果您只想快速预览一些 SVG，该怎么办？如果它们在 JS 内部，它们可能是动态的（采用填充、颜色等道具），但是我可以使用默认值（如果提供）预览它们，或者提供给它们道具的简单方法吗？

有没有 VSCode 插件可以做到这一点？人们如何解决这个问题？

我想要一些CSS代码以iPad和桌面为目标,最大宽度:768.

这(我不知道为什么,很高兴知道)不适用于iPad(只有桌面):

@media only screen and (max-width: 768px)

所以我不得不为iPad做这个:

@media only screen and (device-width: 768px)

但是,我在两个媒体查询中都有完全相同的代码,我无法接受.

我也尝试了这个:

@media only screen and (max-width: 767px) or (device-width: 768px)

上面的这个也不起作用 - 它实际上适用于桌面,无论宽度,而不是iPad.真奇怪.

如何使用相同的媒体查询同时定位iPad和桌面？

我的主要目标是调整Yeoman的gulp-webapp开发工作流程来运行PHP.

具体而言,我希望能够使用gulp-php-connect与多个基目录(从萨斯编译CSS)和途径(对鲍尔的依赖),如果这甚至有可能.

我可以使用gulp-connect-php插件使用Gulp运行PHP ,如下所示:

gulp.task('connect-php', function() {
  connectPHP.server({
    hostname: '0.0.0.0',
    bin: '/Applications/MAMP/bin/php/php5.5.3/bin/php',
    ini: '/Applications/MAMP/bin/php/php5.5.3/conf/php.ini',
    port: 8000,
    base: 'dev'
  });
});

但是,我想利用gulp-webapp优秀但非常纠结的开发工作流架构,它依赖于BrowserSync,Sass编译器(将.css文件编译成.tmp文件夹,用于开发),自动前缀和使用了一堆其他有用的插件.

以下是我想要适应的部分gulp-connect-php或任何其他PHP:

gulp.task('serve',  ['styles'],function () {
  browserSync({
    notify: false,
    port: 9000,
    server: {
      baseDir: ['.tmp', 'app'],
      routes: {
        '/bower_components': 'bower_components'
      }
    }
  });

  // watch for changes
  gulp.watch([
    'app/*.html',
    '.tmp/styles/**/*.css',
    'app/scripts/**/*.js',
    'app/images/**/*'
  ]).on('change', reload);

  gulp.watch('app/styles/**/*.scss', ['styles', reload]);
  gulp.watch('bower.json', ['wiredep', 'fonts', reload]);
});

BrowserSync有一个代理选项,允许我用gulp-connect-php服务器运行它,这是非常了不起的.但是我需要gulp-connect-php使用多个基本目录和路由,比如BrowserSync …

我想改编一个gulpfile.js并将我的bower_components/文件夹更改为app/bower_components/.

我更新了目录.bowerrc,所以现在每次我做的bower install时候都会使用正确的目录:

{
  "directory": "app/bower_components"
}

现在,如何gulp-wiredep在我的主Sass文件中编写正确的Sass路径位置？

例如,gulp-wiredep在我的main.scss文件中添加以下行,紧接着// bower:scss:

@import "bower_components/bootstrap-sass-official/assets/stylesheets/_bootstrap.scss";

应该是现在 @import "app/bower_components/bootstrap-sass-official/assets/stylesheets/_bootstrap.scss";

我该如何改变这条道路？我相信这是一些配置wiredep任务:

gulp.task('wiredep', function () {
  var wiredep = require('wiredep').stream;

  gulp.src('app/styles/*.scss')
    .pipe(wiredep({
      ignorePath: /^(\.\.\/)+/
    }))
    .pipe(gulp.dest('app/styles'));

  gulp.src('app/*.html')
    .pipe(wiredep({
      exclude: ['bootstrap-sass-official'],
      ignorePath: /^(\.\.\/)*\.\./
    }))
    .pipe(gulp.dest('app'));
});

但我不知道如何配置它来做我需要的东西,我找不到任何关于它的文档.

我知道如果我在我的sass文件中手动更改该路径"app/bower_components/bootstrap-sass-official/assets/stylesheets/_bootstrap.scss",那么gulp serve它将起作用,但是一旦我安装了一个bower组件,它就会将该路径更改为没有app/在开头的那个路径,它将破坏任务.

如何解决？

完成:

// inject bower components
gulp.task('wiredep', function () {
  var wiredep = require('wiredep').stream; …

当我点击我的自定义帖子中的分页链接类型"工作"列表的帖子(或输入像"mysite.com/works/page/2"这样的URL)时,我得到404页面.

常规帖子类型分页(博客)正常工作.另外,关于我的自定义帖子类型"工作"的其他一切似乎工作正常.

我的template-works.php文件包含:

get_home_pagination();

$ args = array('post_type'=>'works','posts_per_page'=> 10,'paged'=> $ paged); $ wp_query = new WP_Query($ args);

if($ wp_query-> have_posts()):

while($ wp_query-> have_posts()):$ wp_query-> the_post(); get_template_part('loop','works'); ENDWHILE;

否则:_e('这里没什么.'); 万一;

在template-blog.php中使用相同的代码(当然替换post-type),其中分页链接正常工作.

然后在functions.php中我得到了:

function get_home_pagination(){

global $ paged,$ wp_query,$ wp; $ args = wp_parse_args($ wp-> matched_query);

if(!empty($ args ['paged'])&& 0 == $ paged){

  $wp_query->set('paged', $args['paged']);
  $paged = $args['paged'];

Run Code Online (Sandbox Code Playgroud)

}}

有一刻我认为这是因为WordPress在循环中找不到任何帖子:它试图在没有帖子时获得帖子ID,如post-template.php的第29行.但后来我意识到了这一点:

例如,如果我输入URL"(...)/ blog/page/456",则博客模板会加载消息"Nothing here".没有404错误页面.

另一方面,我希望返回一些帖子的URL"works/page/2"在404错误页面上结束.

为什么？

编辑:

在404页面上我也收到此错误:

试图在第29行的(...)/wordpress/wp-includes/post-template.php中获取非对象的属性.

...但它可能与分页问题无关.我设法删除导致此错误的代码(来自我自定义的插件),并且分页仍然不起作用.

编辑:

这是我通过Debug-this插件调试URL mysite.com/trabalhos/pagina/2得到的.这似乎是非常错误的:

Obs:trabalhos = works,pagina = page

匹配规则:trabalhos /([^ /] +)(/ …

在下面的示例中,当我将鼠标悬停在"X"按钮上时,列表项hover样式也会启用,我不希望这种情况发生.

hover按钮上的hover样式是否可以独立于样式list-group-item？像防止"悬停"传播的东西？

有没有其他方法可以实现这一目标？也许以不同的方式组装所有这些HTML/CSS/JS？

在这里工作样本

<ul class="list-group">
  <li class="list-group-item">
    Lalalalaiaia
                <button class="btn btn-default btn-xs pull-right remove-item">
      <span class="glyphicon glyphicon-remove"></span>
    </button>
  </li>
  <li class="list-group-item">
    Panananannaeue 
                <button class="btn btn-default btn-xs pull-right remove-item">
      <span class="glyphicon glyphicon-remove"></span>
    </button>
  </li>
</ul>

CSS

.list-group-item:hover {
  background: #fafafa;
  cursor: pointer;
}

JavaScript的

  $('.list-group-item').on('click', function(){
    console.log('clicked item');
  });

  $('.remove-item').on('click', function(e){
    console.log('clicked remove-item btn');
    e.stopPropagation();
  });

UPDATE

问题似乎是当鼠标悬停在内部X按钮上时,鼠标实际上没有离开'list-group-item'元素,因此,它保持悬停状态.

我能够通过手动调度来解决它mouseenter,并mouseleave在在"列表中基团的项目" mouseleave和mouseenter所述"删除项目"按钮,分别的事件,而无需使用"event.stopPropagation()"(除按钮单击处理程序).

缺点是我需要一个mouseenter和mouseleave两个元素的事件处理程序.我最好只使用CSS,但这似乎是不可能的.

我不确定这是否是一个干净的解决方案,你怎么看？ …

我正在重写一个使用Bourbon的"旧"React原型,它还在gulpfile中使用gulp-sass来注入一个节点整齐的依赖:

var sassOptions = {
    includePaths: require('node-neat').includePaths,
};

我想使用create-react-app样板并通过使用npm脚本编译sass文件来为样式设置一个"简单"的工作流程(也因为create-react-app限制了你)但我无法弄清楚如何去做.

"build-css": "node-sass src/styles/ -o src/",
"watch-css": "npm run build-css && node-sass src/styles/ -o src/ --watch --recursive"

我可能会在将来使用不同的方法重写样式(可能使用样式组件,可能继续使用Sass并完全忽略Bourbon)但我只需要从旧项目中移植Sass样式.

有关集成create-react-app(不弹出)和Bourbon/Neat的任何想法？

有没有办法将neat.includePaths位放入package.json中的node-sass单线程脚本中,例如？

是否可以让react-select回退到移动设备上的本机选择？

实际上，为什么这不是默认行为？