ブラウザ拡張機能を作るためのReactフレームワーク『Plasmo』
Plasmoとは Plasmoはブラウザ拡張機能を作成するためのReactフレームワークです。 テストや自動デプロイするための機能なども提供しておりオールインワンなフレームワークとなっています。 公式サイトに行くと「ブラウザ拡張機能におけるNext.js」という強気なワードが確認できます。 It's like Next.js for browser extensions! Plasmoの特徴 Plasmoは以下のような特徴を持ったフレームワークです（公式より一部抜粋）。 ファーストクラスのReact＋Typescriptサポート ライブリローディング + React HMR .env* ファイルサポート BPP による自動デプロイメント Svelte と Vue をオプションでサポート またゼロコンフィグで開発を始めることができ、ブラウザ拡張機能の設定ファイルであるmanifest.jso
いちばんやさしい webpack 入門
webpack is 何? webpack とは、一言で言うと JavaScript 向けのモジュールバンドラーです。 複数の JavaScript モジュールを一つ（またはいくつか）のファイルへバンドル（=bundle: 束にする、包む）してくれます。 複数の JS モジュールを（場合によっては CSS や画像などのアセット類も）一つにまとめる すでに新規開発の終了も伝えられる webpack ですが、「STATE OF JS 2022」ではいまだに利用率 No.1 の地位にあります。 webpack 後継のモジュールバンドラーとしては、すでに Turbopack の開発開始がアナウンスされています。しかし、これがプロダクションレベルに達するまでは webpack がおそらく使い続けられることになるでしょう。 使うメリットは何？ モジュールを 1 つ（もしくは少数）にまとめることでブラウ
Re: 僕らを縛る Node.js という呪いについて - あるいはなぜ TypeScript 以外が真っ当な選択肢にならなかったか
Re: 僕らを縛る Node.js という呪いについて - あるいはなぜ TypeScript 以外が真っ当な選択肢にならなかったか https://d.potato4d.me/entry/20220405-nodejs/ へのアンサーソング。 プログラミング言語としての JavaScript の話をする。 2010年頃、Python 2 でプログラミングを学習した自分にとっては Node.js + CoffeeScript が Better Python だった。 CoffeeScript は当時の JS(ES3~5) に足りない機能を補ってくれて、Python と同じく空白制御のオフサイドルールなのが気に入った。見た目が少しだけ Ruby っぽいので当時全盛だった Rails の人間に訴求するにも有利だった。 Node.js のモジュールシステムである Commonjs は Pytho
Webpack 5を使ったvue.jsの環境構築とSFCの利用方法 | アールエフェクト
Vue CLIを利用することでvue.jsの開発環境を簡単に構築することができます。Vue CLIで簡単に環境構築、アプリケーションの開発を行うことができますが裏側で何が行われているのかわからない人も多いのではないでしょうか。Vue CLIを利用することなしでWebpackをインストールを行いSingle File Component(単一ファイルコンポーネント)を使ってVueのアプリケーションを構築できる環境を作成してみたいという人向けに本文書を作成しています。本文書ではwebpackのインストールからSFCを使えるまでの手順をStep By Stepで丁寧に説明していますので一通り読み終えるとVueで開発を行うためにwebpackで必須な設定を理解することができます。 Vueの開発環境の構築に関する知識も深まります。 Single File Componentとは VueのSingle
webpackで開発用/本番用の設定を分ける - Qiita
root/ ├ dist/ │ └ ビルド後のファイル ├ src/ │ ├ css │ └ js 等 ├ webpack.config.js └ package.json // pathとかpluginとか const path = require('path') module.exports = { entry: { // エントリポイント app: ... }, output: { // filenameとかpathとか path: ... , filename: ... }, module: { rules: [ // loaderの設定 { test: ... , loaders: [ ... ], } ] }, devServer: { // webpack-dev-server用の設定 }, plugins: [ // プラグイン設定 ] } "scripts": { "bu
最新版で学ぶwebpack 5入門 - JavaScriptのモジュールバンドラ - ICS MEDIA
webpack（ウェブパック）とはJSファイルをまとめる高機能なモジュールバンドラー。まとめることでウェブページのHTTPリクエストの数を減らしたり、高度なウェブアプリケーションの開発に役立ちます。 連載ではTypeScriptやBabelなどのES2015+の環境構築、ReactなどのJSライブラリの設定方法を網羅。サンプルファイルで詳しく解説します。 webpackの入門記事は他のサイトにもありますが、対象バージョンが古くて使えなかったりします。検索結果の上位の野良記事を参照にしたら古いバージョンの内容ばかり。解説記事通りにやったのにうまく動かない･･･なんて困った方も多いのではないでしょうか。本記事は常に最新版に対応させているので、安心して読み進めてください。 ※本記事では2023年3月現在のwebpack 5（2020年10月リリース）以上で解説しています。 本記事で解説しているこ
面倒なJavaScriptコードのとりまとめがこれ1つで可能に、「webpack」入門 | さくらのナレッジ
最近JavaScript関連の開発で採用が進んでいる「webpack」は、JavaScriptファイルの変換や結合といった操作をコマンド1つで実行できるツールだ。本記事では、webpackとは何かという基本的な概念から導入方法、実際の利用例などを紹介する。 モジュール管理機構の不足や未サポート機能の問題をツールで解決する「webpack」 今日のWeb開発においてJavaScriptの利用は避けることができないが、JavaScriptのソースコードをどのように管理・デプロイすべきかという問題に対しては、まだ決定的な解決策が生まれていない状況が続いている。その根本的な原因の1つには、最近までJavaScriptにおいて普遍的に利用できるモジュール管理システムが存在しなかったことがある。 一般的なプログラミング言語では、大規模なプログラムを実装する際に作業性やメンテナンス性を高めるためプログラ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
