小编Bob*_*bby的帖子

我正在尝试使用 svelte 制作一个应用程序来试用它。

我想设置 prettier 和 eslint，我安装了这些依赖项和 Svelte for VS Code 的扩展。

  "dependencies": {
    "eslint": "^7.7.0",
    "eslint-plugin-svelte3": "^2.7.3",
    "prettier": "^2.0.5",
    "prettier-plugin-svelte": "^1.1.0",
    "save-dev": "0.0.1-security",
    "sirv-cli": "^1.0.0",
    "stylelint": "^13.6.1"
  }

现在，我无法设置所有内容。

我做了

.eslintrc

{
  "plugins": ["eslint-plugin-svelte3"],
  "parserOptions": {
    "ecmaVersion": 6,
    "sourceType": "module",
    "ecmaFeatures": {
      "jsx": true
    }
  },
  "rules": {
    "semi": "error"
  }
}

.prettierrc

{
  "tabWidth": 2,
  "semi": false,
  "singleQuote": true,
  "trailingComma": "es6"
}

我想在 .vscode 下使用 settings.json 自动保存

{
  "editor.formatOnSave": true,
  "editor.defaultFormatter": "esbenp.prettier-vscode",
  "editor.codeActionsOnSave": {
    "source.fixAll.eslint": true,
    "source.fixAll.prettier": true …

我的苗条项目有以下问题

主文件

import App from './App.svelte';

const app = new App({
  target: document.body,
});

export default app;

第一行返回警告

插件打字稿：@rollup/plugin-typescript TS2307：找不到模块“./App.svelte”或其相应的类型声明。

但我的配置看起来没问题我确实安装并添加"@tsconfig/svelte": "^2.0.1",到我的 tsconfig

汇总配置文件

import svelte from 'rollup-plugin-svelte';
import commonjs from '@rollup/plugin-commonjs';
import resolve from '@rollup/plugin-node-resolve';
import livereload from 'rollup-plugin-livereload';
import { terser } from 'rollup-plugin-terser';
import typescript from '@rollup/plugin-typescript';
import css from 'rollup-plugin-css-only';
import preprocess from 'svelte-preprocess';
import alias from '@rollup/plugin-alias';

const production = !process.env.ROLLUP_WATCH;

function serve() {
  let server;

  function toExit() {
    if (server) server.kill(0);
  } …

所以我读到：正则表达式在 regex101.com 上有效，但在 prod 上无效

我在 antd 中创建了以下规则：Demo

    <Form.Item
      validateStatus={usernameError ? "error" : ""}
      help={usernameError || ""}
    >
      {getFieldDecorator("username", {
        rules: [
          { required: true, message: "Please input your username!" },
          {
            type: "regexp",
            pattern: new RegExp(
              /^(?=.*[0-9])(?=.*[a-zA-Z])(?=.*[!#$%\-_=+<>])([a-zA-Z0-9!#$%\-_=+<>]+)$/
            ),
            message: `Password Pattern`
          }
        ]
      })(
        <Input
          prefix={<Icon type="user" style={{ color: "rgba(0,0,0,.25)" }} />}
          placeholder="Username"
        />
      )}
    </Form.Item>

正则表达式应该匹配任何必须包含至少 1 个数字、1 个字母和 1 个特殊字符的内容。

从日志中可以看出，正则表达式在 JS 中正常工作，但在 antd 中，该模式不起作用。

另外，我遵循了这个，我正确地添加了type="regexp"

还缺少什么？

我在 angular 11 中遇到了这个错误，但我尝试应用我在网上找到的所有修复程序......

错误 ：

错误：src/app/app.component.html:1:1 - 错误 NG8001：'router-outlet' 不是已知元素：如果 'router-outlet' 是一个 Angular 组件，则验证它是否是该模块的一部分

应用程序组件.html

   <router-outlet></router-outlet>

app.module.ts

@NgModule({
  imports: [
    AppRoutingModule,
    AppStoreModule,
    BrowserModule,
    BrowserAnimationsModule,
    EffectsModule.forRoot(),
    HttpClientModule,
    AngularSvgIconModule.forRoot(),
    NgbModule,
  ],
  providers: [
    {
      provide: HTTP_INTERCEPTORS,
      useClass: ApolloInterceptor,
      multi: true,
    },
    {
      provide: ErrorHandler,
      useValue: Sentry.createErrorHandler({
        showDialog: true,
      }),
    },
    {
      provide: Sentry.TraceService,
      deps: [Router],
    },
    {
      provide: APP_INITIALIZER,
      useFactory: () => () => {},
      deps: [Sentry.TraceService],
      multi: true,
    },
  ],
  bootstrap: [AppComponent],
})
export class AppModule {}

app.routing.ts

import { …

我有一个以前从未有过的问题.

我想在移动设备更改为方向时调用一个函数,所以我使用"onorientationchange"并确保它被触发,我也使用"onresize".

问题是因为一个神秘的原因甚至不能在页面上工作:

如果我做

document.body.addEventListener("resize",function(){console.log("here")};

它不起作用,我创建了一个自定义版本的AddEventListener:

function addNewEvent(elementDOM, evenement, fonction){
        var refEvent = null;
        if(elementDOM)
        {
        elementDOM["on"+evenement] = fonction;
            if (elementDOM.attachEvent)
            {
                refEvent =function() {
                    return fonction.call(elementDOM,window.event);
                };
                elementDOM.attachEvent ('on'+evenement,refEvent);
            }
            else if (elementDOM.addEventListener)
            {
                refEvent = fonction;
                elementDOM.addEventListener (evenement,refEvent,false);
            }
            else
            {
                elementDOM["on"+evenement] = fonction;
            }
        }
        return refEvent;
    },

即使这个不起作用......

但这有效:

document.body.onresize = function(){console.log("here")};

这是一个普通的网页,我不明白为什么它不起作用.

你能帮我吗？:X

我正在尝试使用一些JavaScript和画布绘制一些图表。

我正在做这样的事情：

RadarChart.prototype.fillRadar = function () {
var nbLabel = this.data.labels.length;
this.context.save();
this.context.lineWidth = 0.5;
this.context.lineJoin = "round";
this.context.translate(this.canvas.width / 2, this.canvas.height / 2);
this.context.strokeStyle = this.data.lineColor;
for (var i = 0; i < nbLabel; i++) {
    this.context.moveTo(0, 0);
    this.context.lineTo(0, -((this.canvas.height / 2) - 30))
    this.context.stroke();
    this.context.rotate((Math.PI / 180) * (360 / nbLabel));
}
this.context.restore();
}

问题是我的线条太像素化了，并不完美。它们的宽度似乎改变了。就像随着时间的流逝而消失...

为什么这样做呢？我该如何解决？

感谢帮助。

我正在学习 angular 并试图制作一个非常简单的英雄列表。

我在这样的 json 中有一个英雄列表

    {
        "name" :"Bobby",
        "avatar" : "myHero1.jpg",
        "power" : "12",
        "description" : "the strongest"
    }

我将这个 json 列表加载到一个组件中，我想在一个表中显示所有这些列表，并且能够单击它们以详细查看它们的统计信息。

我想将该 json 转换为一个简单的打字稿类/对象，这样我就不必猜测和硬编码this.hero["stats"]，只需将MyHeroClass.stats.

我的问题是，在 angular 中，我应该在哪里存储这个类，我应该如何制作它？

它是否必须是导出的组件（没有 html 和 css？），或者我可以在某处创建一个类并将其导入到我需要的地方吗？

谢谢