小编Cro*_*csx的帖子

我在Canvas中创建了一个小游戏,但我遇到了问题.将默认缩放设置为100%以外的某些用户无法看到整个游戏页面.

我试过使用这个CSS:

zoom: 100%;

这个HTML

<meta name="viewport" content="initial-scale=1.0 , minimum-scale=1.0 , maximum-scale=1.0" />

这个JS:

style="zoom: 75%"

任何想法如何以编程方式设置页面缩放？

我有一个带有 tailwind 的项目和一个（正在进行中的）UI 库，我们希望逐步迁移到该库。

index.css我正在像这样导入样式

@tailwind base;
@tailwind components;
@tailwind utilities;


@import '@customPackage/ui-react/dist/style.css';

问题是，tailwind 基础导入了一些与我的 customPackage 样式冲突的样式：

.ak2yjgf是由customPackage css生成的样式，而是button, [type='button'], [type='reset'], [type='submit']由tailwind生成的样式。

我知道可以添加用于@layers base顺风的自定义样式，但这不会覆盖基本样式，它只是添加更多样式。我想知道是否有办法覆盖或删除仅base导入buttons。

我正在使用 stylelints，并且我有一些想要禁用的规则：

在 less 中我必须以这种方式进行计算，top: calc(~'50% + 30px');但“function-calc-no-invalid”阻止它

https://stylelint.io/user-guide/rules/function-calc-no-invalid

另外，我想让我的更少的代码直接将 css 应用到组件，这样

my-componet { width:100px}所以我需要禁用“选择器类型无未知”

https://stylelint.io/user-guide/rules/selector-type-no-unknown

我尝试创建一个 .stylelintrc 文件并添加以下内容

    "selector-type-no-unknown": "custom-elements",
    "function-calc-no-invalid": "false",

和许多变化，但我不断得到

无效选项：规则“function-calc-no-invalid”的意外选项值“false” 无效选项：规则“selector-type-no-unknown”的意外选项值“custom-elements”

我正在使用 Angular 12，并使用 Service Worker 来部署新版本。

看起来每次我将新版本部署到生产环境时（并且由于某种原因不在暂存阶段）。一些用户收到一堆错误，例如

未捕获（承诺）：ChunkLoadError：加载块 XXX 失败。

关于这个问题有很多帖子，但在我看来，解决方案是个案的。

与 stg 相比，我在生产方面的差异只是而已。

我打电话 enableProdMode();

我的服务人员设置如下：

    ServiceWorkerModule.register('ngsw-worker.js', {
      enabled:
        environment.env === Environment.PRODUCTION || environment.env === Environment.STAGING,
      registrationStrategy: 'registerWhenStable:30000',
    }),

我的配置看起来像

{
  "$schema": "../../node_modules/@angular/service-worker/config/schema.json",
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": ["/favicon.ico", "/index.html", "/manifest.webmanifest", "/*.css", "/*.js"]
      }
    },
    {
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "lazy",
      "resources": {
        "files": ["/assets/**", "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"]
      }
    }
  ]
}

这就是我显示更新的方式（基本上是一个可以忽略的横幅）：

@Component({
  selector: 'app-live-update-notifier',
  templateUrl: './live-update-notifier.component.html',
  styleUrls: ['./live-update-notifier.component.scss'],
})
export class …

这与在打字稿中扩展2类有点相似，但是尽管我设法在打字稿中做到了这一点，但我找不到在angular中正确的方法。

我有一个带有1个组件，一个服务和一个通用类的angular 7应用程序。

就像这个 Stackblitz

我想制作一个继承自我的班级的组件，以及另一个我的组件

这是我的课=>

export class MyClass1<T,O> {
  propertyClass1 = "MyClass1"
  constructor() {
  }

  init(value:string){
    this.propertyClass1 = value;
  }
  sayHelloClass(value:string){console.log('class say'+ value)}
}

这是我的组件=>

export class MyCom1Component implements OnInit {
  propertyComp1 = "MyCom1"
  constructor(private service1:Service1Service) {
      this.propertyComp1 = service1.getProp();
   }

  ngOnInit() {
  }

  sayHelloComponent(value:string){console.log('component say'+ value)}
}

我希望我的孩子能扩展展位，以便我能够

  ngOnInit() {
    this.sayHelloClass(this.propertyClass1); // class say MyClass1
    this.init("hoohoho");
    this.sayHelloClass(this.propertyClass1); // class say hoohoho


    this.sayHelloComponent(this.propertyComp1); // component say MyCom1
  }

我试过的是这个=>

const addMyClassOneInheritance = <T extends new(...args: any[]) => any>(MyCom1Component: …

我正在尝试制作一个 Svelte 应用程序，其中我有一个类（不是 svelte 组件）来创建音频源并管理它。

我想跨多个组件获取此类实例。

现在，我发现的唯一方法就是这样做：

<script lang="ts" context="module">
  import { AudioAnalyser } from "@app/class/audio/AudioAnalyser";
  import type { MediaAnalyser } from "@app/types/analyser";

    let analyser: MediaAnalyser = new AudioAnalyser();
</script>

在组件内部，所以我确信只有一个实例，并通过属性绑定与其他组件共享该实例。

但我正在尝试找到一种方法，可以实例化此类一次并通过所有应用程序访问它，就像使用角度服务一样。

谢谢

我正在使用 redux，redux-observable。

我有以下内容

import { EMPTY, Observable } from "rxjs";

const setCurrentDatastoreIdEpic = (action$, state$): Observable<any> => action$.pipe(
    ofType(DatastoreActions.setCurrentDatastoreId),
    map((action: {payload: {datastoreId: string}}) => {
        if(action.payload.datastoreId) {
            return ItemsActions.getItemsListRequest({
                datastoreId: action.payload.datastoreId,
                page: 1,
            });
        } else {
            return EMPTY;
        }
    })
);

但每次我进去的时候我都有

未捕获的错误：操作必须是普通对象。使用自定义中间件进行异步操作。

但他们说如果没有调度任何操作，则使用 E​​MPTY。

我也尝试过Observable.empty()，但它说 Observable 中不存在空（从我所看到的情况来看，这种方式已被弃用）

我有一个按 Enter 时提交的 textarea

https://stackblitz.com/edit/angular-uvxifq-uyxteg

<textarea class="message-area" (keyup.enter)="ValidateCommentAndPost(commentErr, $event);" [(ngModel)]="comment" matInput #commentErr="ngModel"></textarea>

我想在按下 Enter 键时禁用新 Line，所以我在网上获取了一些信息并做了 .

ValidateCommentAndPost(ngComment:NgModel, event?:KeyboardEvent){
    event.preventDefault();
    if((ngComment.invalid && (ngComment.dirty || ngComment.touched)) && ngComment.errors) {
        this.ResetComment();
    } else {
        this.PostComment();
    }
}

但这不起作用，return false;仍然创建一条白线。

我能做什么？

我正在尝试将 eslint 添加到我的打字稿create-react-app应用程序中。我正在使用 Visual Studio 代码。

我做了：

1. 下载可视化代码中的Eslint包
2. 下载 Eslint 包
3. 我安装了3个eslint插件

    "eslint:recommended", 
    "plugin:@typescript-eslint/recommended",
    "plugin:react/recommended"

4. 在应用程序的根文件夹中创建一个.eslintrc如下所示的文件

{
  "plugins": [
    "react"
  ],
  "extends": [
    "eslint:recommended", 
    "plugin:@typescript-eslint/recommended",
    "plugin:react/recommended"
  ],
  "parserOptions": {
    "ecmaVersion": 7,
    "sourceType": "module",
    "ecmaFeatures": {
        "jsx": true
    }
  },
  "env": {
    "browser": true,
    "node": true,
    "es6": true
  },
  "settings": {
    "import/resolver": {
      "node": {},
      "babel-module": {
        "root": ["./src"]
      }
    }
  }
}

5. 启动 eslint 并重新启动 vs code

现在，我尝试做一些 linting 问题，例如尾随空格或不是 pascalCase，但我从未收到 Eslint 的警告，我只看到打字稿错误，但从未看到类似的 linting 问题。

是否需要进行一些额外的配置才能使其在我的工作区上运行？

我有一个在严格模式下使用 React 和 GraphQL 的项目。

我更新了一些包，现在在包含异步调用的 useEffect 中收到以下错误。

  useEffect(() => {
    const loadTags = async () => {
      const { data } = await fetchTags();
      setTags([...(data?.tags || [])]);
    };

    loadTags();
  }, [current, fetchTags]);

DOMException：信号在异步调用的 useEffect 中无故中止。

我不太确定是什么原因造成的，我相信使用效果会重新运行并自行清除，并且它不会正确中止查询。

以前没有发生过这种情况，或者至少没有产生错误。

我想知道我的实现是否不正确，或者我更新的某些包是否出现问题，我在 github 上找不到我更新的包的任何相关线程