小编elm*_*lmi的帖子

顶级等待不适用于 Parcel

当我在实时服务器插件(或编辑实时Webstorm IDE)await中运行顶级时,它可以正常工作;但是,当我使用.npx parcel index.html

未捕获的语法错误:await 仅在异步函数和模块的顶层主体中有效

const res =  await Promise.resolve('hi there');

console.log(res)
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
    <script type="module" defer src="script.js"></script>
    <title>parcel and top-level-await</title>
  </head>
  <body>
  </body>
</html>
Run Code Online (Sandbox Code Playgroud)
   {
  "devDependencies": {
    "parcel": "^2.2.1"
  },
  "name": "top-level-await",
  "version": "1.0.0",
  "main": "index.js",
  "author": "elmi-elmi",
  "license": "MIT"
}
Run Code Online (Sandbox Code Playgroud)

javascript asynchronous parcel

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

为什么 CSS“模糊”背景过滤器在 Chrome 中不起作用?

在 CSS 中,我使用该backdrop-filter属性来模糊粘性标题的背景。

因此,我使用backdrop-filer:blur(10px)并设置了opacity:50%.

如果运行代码,粘性标题背景将不会模糊。你能告诉我为什么示例代码不起作用吗?

.sticky{
    background-color:orangered;
    opacity: 50%;
    backdrop-filter: blur(10px);


    position: sticky;
    top:0;
    height: 100px;
}
Run Code Online (Sandbox Code Playgroud)
 
  <body>
   
      <div class="sticky">
        <h1>This is a header</h1>
      </div>
   

      <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam
        asperiores at autem, dicta dignissimos ex, fugiat fugit harum id itaque
        nulla odio perferendis quasi qui similique! Doloribus nesciunt quaerat
        tempora.

      </p>
      <div style="height: 400px"></div>
      <p>
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Aperiam
        asperiores at autem, dicta …
Run Code Online (Sandbox Code Playgroud)

css

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

标签 统计

asynchronous ×1

css ×1

javascript ×1

parcel ×1