Skip to content

Instantly share code, notes, and snippets.

Koutaro Chikuba mizchi

Block or report user

Report or block mizchi

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
View study-unified.ts
import unified from "unified";
// @ts-ignore
import visit from "unist-util-visit";
import u from "unist-builder";
// var tree = u("root", [
// u("subtree", { id: 1 }),
// u("subtree", { id: 2 }, [
// u("node", [u("leaf", "leaf 1"), u("leaf", "leaf 2")]),
// u("leaf", { id: 3 }, "leaf 3"),
View scripts-build-library.js
const rewire = require("rewire");
const path = require("path");
const defaults = rewire("react-scripts/scripts/build.js");
const config = defaults.__get__("config");
config.optimization.runtimeChunk = false;
config.output.filename = "excalidraw.js";
config.output.libraryTarget = "umd";
config.output.library = "Excalidraw";
config.output.path = path.join(__dirname, "../dist");
View run-postcss-in-browser.ts
// @ts-ignore
import precss from "precss";
import postcss from "postcss";
import autoprefixer from "autoprefixer";
const input = `
/* autoprefixer grid: autoplace */
.container {
width: 100%;
height: 100%;
View ee.ts
class EventEmitter {
_handlersMap = new Map<string, Function[]>();
on(event: string, fn: Function) {
if (this._handlersMap.has(event)) this._handlersMap.set(event, []);
const funcs = this._handlersMap.get(event);
funcs.push(fn);
}
emit(event: string, ...args: any) {
View 20 年代のフロントエンド.md

明日の下書き


これはなに

  • 高円寺.dev #3 用の資料 https://koenji.connpass.com/event/160886/
  • フロントエンド専門じゃない人向けの、フロントエンドの最先端〜やや未来の話です
  • このレイヤーでは Node.js を使うべき/使うと強いという部分がありますが、他言語を否定しているわけではありません。むしろ他言語でこのアーキテクチャを模倣してほしいという話です。
View try-pnp.md

package.json

{
  "name": "foo",
  "version": "1.0.0",
  "main": "index.js",
  "license": "MIT",
  "installConfig": {
    "pnp": true
  },
View VSCODE_CODE_READING_MEMO.md

Entrypoint を探す

yarn web で起動する scripts/code-web.js を読む。 node の http-server になって、パスを動的に書き換えている。

(サーバーが本当に必要なのか?静的アセットにならないんだろうか?という目線で読む)

試しに変数をダンプしてみた。

View test-runner.ts
// @ts-ignore
import { compile } from "@mizchi/web-compiler";
async function transformInput(code: string) {
const out = await compile({
entry: "/index.js",
files: {
"/index.js": code
},
pkg: {
View server.js
const express = require('express');
const app = express();
app.use(express.json());
app.use((_req, res, next) => {
res.header("Access-Control-Allow-Origin", "*");
res.header(
"Access-Control-Allow-Headers",
"Origin, X-Requested-With, Content-Type, Accept"
);
View index.html
<!-- Copyright (C) Microsoft Corporation. All rights reserved. -->
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<!-- Disable pinch zooming -->
<meta
name="viewport"
content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"
You can’t perform that action at this time.