小编Bra*_*ods的帖子

Babel将'import'转换为'require',但'require'在ecma5中不可用

我的理解是使用Babel允许您通过转换在ecma5环境中使用ecma6 javascript.但是,当我使用'import'时,'import'被转换为'require'.'require'不是ecma5,需要库'require.js'.因此,如果没有其他依赖关系,则无法使用"导入/导出",这是正确的吗?

javascript require ecmascript-6 babeljs

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

使用<symbol>编写SVG脚本

我正在尝试在JS中创建一个SVG元素,然后将其附加到DOM.SVG元素引用了一个符号.我可以使用该insertAdjacentHTML方法实现此目的,但不能通过appendChild方法实现.

在使用时appendChild,根据浏览器检查员,所有正确的东西都在DOM上,但它没有正确呈现.谁能明白为什么?

http://codepen.io/bradjohnwoods/pen/dGpqMb?editors=101

<svg display="none">
  <symbol id="symbol--circle--ripple" viewBox="0 0 100 100">
    <circle cx="50" cy="50" r="25" />
  </symbol>
</svg>

<button id="btn">
</button>

<script>
var btn = document.getElementById('btn');

//var myString = '<svg><use xlink:href="#symbol--circle--ripple" width="100" height="100" class="btn--ripple__circle"></use></svg>';
//btn.insertAdjacentHTML('afterbegin', myString);

var svg = document.createElement('svg');
var use = document.createElement('use');
use.setAttribute("xlink:href", "#symbol--circle--ripple");
use.setAttribute("width", "100");
use.setAttribute("height", "100");
use.classList.add("btn--ripple__circle");

svg.appendChild(use);
btn.appendChild(svg);
</script>
Run Code Online (Sandbox Code Playgroud)

javascript svg

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

部署的反应Web应用程序需要硬刷新

使用create-react-app(v1.0.13)启动.每当我更新源和重新部署用户需要硬刷新以获取新内容.我在index.html中包含了非缓存头:

<meta http-equiv="Cache-Control" content="no-store" />

并关闭了提供的服务人员.在部署之前,还要在build文件夹中更改.js文件名(以及index.html中的引用).

reactjs create-react-app

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

SVG 过滤器:比例

我有一个 svg 图形,使用 svg 滤镜附加了一个阴影。我需要缩放阴影,但找不到可以执行此操作的滤镜。有谁知道这是否可能?

<svg class="svg" width="155" height="460" viewbox="0 0 100 100" preserveAspectRatio ="xMidYMin meet">
    <filter id="shadow" class="shadow" width="200%" height="200%">
        <feOffset           dx="0" dy="30"              in="SourceAlpha"    result="offset" />
        <feFlood            flood-opacity="0.12"                            result="opacity" />
        <feComposite                                    operator="in"       in="opacity"        in2="offset"    result="opacityOffset"  />
        <feMerge class="everything">
            <feMergeNode in="opacityBlurOffset" />
            <feMergeNode in="SourceGraphic" />
        </feMerge>
    </filter>
    <circle class="circle"
            cx="50" 
            cy="50" 
            r="40"
            fill="tomato"
            filter="url(#shadow)"/>
</svg>
Run Code Online (Sandbox Code Playgroud)

http://codepen.io/bradjohnwoods/pen/XXMPGY

scale svg-filters

5
推荐指数
1
解决办法
2612
查看次数

OBChanges的rxjs已过时

由于ObjectChanges建立在过时的Object.observe()上(https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/observe)我正在寻找一个观察对象的替代方案财产变化.谁知道一个?

rxjs

5
推荐指数
1
解决办法
1238
查看次数

SVG 投影扩展

我正在尝试操纵 SVG 阴影(以模拟材料设计元素)。

Material Design 中的一个元素包含 3 个不同值的阴影,具体取决于它们所处的海拔高度。我发现用 SVG 元素模拟这一点的最佳解决方案是使用 CSS 过滤器的投影。然而,这并不支持传播。有谁知道一种解决方法可以让我操纵阴影的扩散?我能想到的唯一解决方案是创建 3 个独立的元素,每个阴影 1 个元素并缩放该实际元素,这似乎超出了顶部。

svg dropshadow svg-filters

5
推荐指数
1
解决办法
1888
查看次数

汇总+ React无法编译JSX

我正在尝试使用Rollup + React,但是在汇总遇到JSX时遇到一个错误。

Unexpected token... export default () => <p>M...
Run Code Online (Sandbox Code Playgroud)

我有一个仓库触发该错误。我使用Rollup + React找到的所有文档/示例均未使用最新的Babel,因此可能与Babel有关。

rollup.config.js:

import resolve from 'rollup-plugin-node-resolve';
import commonjs from 'rollup-plugin-commonjs';
import babel from 'rollup-plugin-babel';
import pkg from './package.json';

export default [{
        input: 'src/index.js',
        output: {
        name: 'index',
        file: pkg.main,
        format: 'umd'
    },
    plugins: [
        resolve(),
        commonjs(),
        babel({ 
            exclude: 'node_modules/**',
            presets: ['@babel/env', '@babel/preset-react']
        })
    ],
    external: [
        'react',
        'prop-types',
    ],
    globals: {
        react: "React"
    }
},
];
Run Code Online (Sandbox Code Playgroud)

.babelrc:

{
  "presets": [
  ["@babel/env", { "modules": false }], "@babel/preset-react"] …
Run Code Online (Sandbox Code Playgroud)

rollup jsx reactjs

5
推荐指数
1
解决办法
2302
查看次数

正则表达式不捕获第一个字符

我想捕获除字符串中第一个字母之外的每个字母。
示例字符串:The cat in the hat.

我知道要捕获第一个字母,/[^]/所以我想要类似的东西/not [^]/

regex

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