Node.js関連のことを調べてみた2019年11月12日

Node.js関連のことを調べてみた2019年11月12日
目次

[nodemon] app crashed – waiting for file changes before starting… というエラーに遭遇した時の対処法

# [nodemon] app crashed – waiting for file changes before starting… というエラーに遭遇した時の対処法

## Githubのissuesをのぞいてみる
見たことないくらいのコメント数が付いていました。
https://github.com/linnovate/mean/issues/1066

いろいろな意見があるが問題としては

– nodemonがない(インストールしていない)
– インストールしたnode_modulesに問題がある

## 上記を踏まえ行った対応

1. `npm install -g nodemon` でnodemonをインストール
2. node_modulesを一旦削除して`npm i` でインストールしなおす

## こちらを実行し再度ビルドしたところ正常に動きました。

元記事を表示

Node.js 簡単な応答バッチ処理

# はじめに
Node.jsでyまたはnの応答に従い、バッチ処理を実行するJavaSciptのサンプルを作成しました。
この辺、Promiseとasync/awaitなどを利用して対話的に同期処理を実行すると分けがわからなくところです。
初学者向けと自らの備忘録で掲載します。

# 前提
* OS : Windows7以上
* [Git For Windows 構築ずみ](https://qiita.com/toshi-click/items/dcf3dd48fdc74c91b409)でbashターミナルを使用
* VSCodeでコード編集
* node.js環境構築済み

# バッチ処理リスト

* **batchlist.json**

“`Json
[
{“msg” : “★ ★ リストを確認します。(ls) 実行 = y, 中止 = n ★ ★”,
“con” : “y”,
“can” : “n”,
“cmd” : “ls”
},
{“msg” : “★ ★ パスを確認します。(pwd) 実行 = y, 中止 = n ★

元記事を表示

node splice関数で文字列操作

# まえがき
splice関数で配列操作してみた。

# 参考文献
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/Array/join
https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Global_Objects/String/split
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/splice

# 環境

“`bash
$bash –version
GNU bash, バージョン 5.0.0(1)-release (x86_64-pc-linux-gnu)
Copyright (C) 2019 Free Software Foundation, Inc.
ライセンス GPLv3+: GNU GPL バージョン 3 またはそれ以降

元記事を表示

JavaScriptのトップレベルスコープは常にグローバルスコープではなかった

# JSのトップレベルスコープは常にグローバルオブジェクトだと思っていた

タイトル通りですが、これに関しては疑っていなかったので個人的に割と衝撃でした。何か(?)に**裏切られた気持ち**です。。
もう少し詳しく書くと、JSを実行した時の**グローバルスコープ(=グローバルオブジェクト)**は、ブラウザ上では`window`で、Node.js上では`global`である。が、**トップレベルスコープ**がそれぞれ`window`と`global`ではなかった。
この記事では、**トップレベルスコープ**について検証していきます。

※トップレベルスコープ・・・関数とかの外側、rubyだとmain。

# `window`と`global`について検証
## グローバル変数について確認
まず、ブラウザ上で実行した下記のコードを見ると、`window`グローバルオブジェクト内の**プロパティ**(グローバル変数)になっていることがわかる。

“`javascript
// ブラウザ上で実行
var foo = ‘global’;
bar = ‘global’;
(function(){

元記事を表示

Node(express)でサーバーを立てた時、 CORSエラー出てしまったらヘッダー情報を追加しよう

## 状況・経緯
Node(express)を使用してAPIを作成。そのAPIを別で立てたローカルサーバーでアクセスしたら以下のようなエラーが出た。

“`
Access to fetch at ‘http://localhost:3000/’ from origin ‘http://127.0.0.1:8080’
has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.
If an opaque response serves your needs, set the request’s mode to ‘no-cors’ to fetch the resource with CORS disabled.
“`

`http://127.0.0.1:8080`から`localhost:3000`へのアクセスは CORSポリシーによってブロックされていますといわれてしまった・・・

## CORSとは

オリジン間リソー

元記事を表示

#docker alpine + headless Chrome + #node pm2 + html-pdf-chrome で HTML PDF 変換する。一時ファイル必要なし。

# html-pdf-chrome

https://github.com/westy92/html-pdf-chrome

– puppeteer ではない
– HTMLファイルではなくソースを渡した時にPDF変換したい

# docker

“`
docker run -it alpine ash
“`

# chromium フォント nodejs をインストール

“`
apk add –update udev ttf-freefont chromium nodejs npm
“`

# 必要があれば Google 日本語フォントのインストール

“`
mkdir /noto

cd /noto

wget https://noto-website.storage.googleapis.com/pkgs/NotoSansCJKjp-hinted.zip

unzip NotoSansCJKjp-hinted.zip && mkdir -p /usr/share/fonts/noto && cp *.otf /usr/share/fonts/noto && chmod

元記事を表示

Online完結!Web開発環境クッキングレシピ[ver 2019.11]-その3

[Online完結!Web開発環境クッキングレシピ[ver 2019.11]-その2、の続きです](https://qiita.com/yellow-strelitzia/items/451965b329e7efc563ee)

####手順.8 Heroku用ファイルを追加して、リポジトリを更新
Web開発環境クッキングレシピ[ver 2019.11]-その2、の継続で、gitpodへログインし、.heroku.dockerfileとheroku.ymlファイルを追加します

“`.heroku.dockerfile
FROM node:12.13
WORKDIR /app
COPY . /app
RUN npm i
CMD npm start
“`

“`heroku.yml
build:
docker:
web: .heroku.dockerfile
“`

手順6と同じように、リポジトリを更新する作業をしましょう。

####手順.9 Herokuアカウントを作成する
Herokuのサインアップページを開き、アカウントを作成します。Primary devel

元記事を表示

Online完結!Web開発環境クッキングレシピ[ver 2019.11]-その2

[Online完結!Web開発環境クッキングレシピ[ver 2019.11]-その1、の続きです](https://qiita.com/yellow-strelitzia/items/de1c489908792a65436e)

####手順.5 node.jsで実行するコードを整備する
ログインしたGitpodのページで画面下部のところが、Terminalになっています。
ここで、コマンドを入力して、node.js用のコードを整備していきます。
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/530472/17cfeb88-48f5-e178-ea84-a727c323c7a9.png)

“`
npm init
“`

すべての質問にEnterとして終了させます
今の質問の中で、entry pointをデフォルトのindex.jsで回答したことになり、この情報がpackage.jsonファイルに記載されたので、index.jsという名前のJavascriptコードを用意します
ペー

元記事を表示

Online完結!Web開発環境クッキングレシピ[ver 2019.11]-その1

##サマリー
Web開発を学習しようとする場合、開発環境を準備したり、実行環境を準備したりするまでの流れをつかみ取るのは、実際のところハードルが高いと思います(Web系開発であればなおさら)。
初学者の方でも環境構築まで、つまづかずに行える手順の1つとして思案し、参考になる記事作成をしたいと思い、執筆してみます(ちなみに、筆者は業務ではWeb開発も、Linux系環境も専門外なので、その点はご容赦くださいませ)
>**GitHubリポジトリへコードを配置する方法です。この手順を参考にご自身のソースコードを追加する場合、ソースコードはGitHubを検索するすべての方に見えてしまいますので、認証情報や業務上秘匿にしなくてはいけないような内容を誤って組み込まないように強く留意しましょう。**

この手順では、
– GitHubのリポジトリを作成する
– Gitpodのアカウントを作り、WebベースIDEを利用可能にする
– Herokuへデプロイする
を行います。

##調理の具材
Webブラウザ、Javascript、Node.js、GitHub、Gitpod、Heroku、Docker

元記事を表示

RHEL 8にNode.js 10をインストール(AppStream)

# はじめに

Application Stream(AppStream)を利用してRHEL8にNode.js 10をインストール
(https://qiita.com/witchcraze/items/df4a0baaaad9c932ea30)
参考:[RHEL8のパッケージ構成 – BaseOSとApplication Stream – 赤帽エンジニアブログ]( https://rheb.hatenablog.com/entry/rhel8_baseos_and_appstream)

## サポート

本手法で導入した場合、[Red Hat Enterprise Linux 8 Application Streams Life Cycle – Red Hat Customer Portal](https://access.redhat.com/node/4079021)より、2021-04がEOLだと思われる。
それ以降に報告された脆弱性や不具合への対応は実施されない可能性がある。

## LOG

### インストール

“`shell-session
# cat /etc/

元記事を表示

RHEL 8にNode.js 12をインストール(AppStream)

# はじめに

Application Stream(AppStream)を利用してRHEL8にNode.js 12をインストール
(https://qiita.com/witchcraze/items/df4a0baaaad9c932ea30)
参考:[RHEL8のパッケージ構成 – BaseOSとApplication Stream – 赤帽エンジニアブログ]( https://rheb.hatenablog.com/entry/rhel8_baseos_and_appstream)

## サポート

本手法で導入した場合、[Red Hat Enterprise Linux 8 Application Streams Life Cycle – Red Hat Customer Portal](https://access.redhat.com/node/4079021)より、202X-XXがEOLだと思われる。(2019-11-10時点で不明)
それ以降に報告された脆弱性や不具合への対応は実施されない可能性がある。

## LOG

### インストール

“`shell-se

元記事を表示

新Github Actions を使って npm audit fix と PR 作成を自動化してみた

Security Alerts に怒られる前になんとかしたい!

## やりたいこと

Node.js であれば“`npm audit fix“`で行える依存ライブラリの更新のような保守作業…。
日頃意識していないとなかなか手につかないので自動で Pull Request 作成までできるようにしたい。
欲を言えば、Approve や Merge も自動でやってほしい。(今回はやらない)

## Github Actions

11月13日ごろに正式リリースとなる Github Actions のβ版を試してみました。

### なぜ Github Actions なのか

[Github Marketplace](https://github.com/marketplace?type=actions) で公開されているツールを使って Workflow が組めるので、他の CI/CD サービスよりも Github の操作がしやすいのではと思いました。

## 実装

今回は [Create Pull Request](https://github.com/marketplace/ac

元記事を表示

Node.js(4):module PATH

パス確認

node.jsパスモジュールはディレクトリとファイルパスが取れる。先ずは今のパスを確認する。

“`javascript:app.js

console.log(__dirname); //ディレクトリパス
console.log(__filename);//ファイルパス

“`

“`terminal:terminal
$node app.js
/Users/xxxxx/node_practice/path
/Users/xxxxx/node_practice/path/app.js

“`

パス重要な関数のまとめ

“`app.js
var path = require(‘path’);

//今のディレクトリのパス
console.log(path.dirname(__dirname));
//ディレクトリを組み合わせ
console.log(path.join(__dirname,’/xx’));
//ファイル名
console.log(path.basename(__filename));
//ファイル拡

元記事を表示

headless Chrome で HTMLファイルから PDF変換したいけど 一時ファイル生成をしたくないので #node の html-pdf-chrome を使う

# 実行環境

AWS ElasticBeanStalk の nodejs プラットフォーム環境でトライした。

“`
$ cat os-release
NAME=”Amazon Linux AMI”
VERSION=”2018.03″
ID=”amzn”
ID_LIKE=”rhel fedora”
VERSION_ID=”2018.03″
PRETTY_NAME=”Amazon Linux AMI 2018.03″
ANSI_COLOR=”0;33″
CPE_NAME=”cpe:/o:amazon:linux:2018.03:ga”
HOME_URL=”http://aws.amazon.com/amazon-linux-ami/”

$ cat system-release
Amazon Linux AMI release 2018.03
“`

dockerを使う場合はこちらを参照

[Dockerを使ってHeadless Chromeを動かしてみる – Qiita](https://qiita.com/dd511805/items/dfe03c5486bf1421875a)

元記事を表示

node UI/Server framework 調べ

nuxt.js の作成時に選択できる framework のかんたんな比較 (2019/11/10)

#### UI framework

| | スター |
|:-:|:-:|
| [Ant Design Vue](https://www.antdv.com/) | 8.6k |
| [Bootstrap Vue](https://bootstrap-vue.js.org/) | 10.3k |
| [Buefy](https://buefy.org/) | 6.6k |
| [Bulma](https://bulma.io/) | 37.3k |
| [Element](https://element.eleme.io/) | 42.1k |
| [Framevuerk](https://framevuerk.com/) | 192 |
| [iView](https://www.iviewui.com/) | 22.7k |
| [Tachyons](https://tachyons.io/) | 9.3k |
| [Tailwind CSS](https://tailwin

元記事を表示

#AWS ElasticBeanStalk + Amazon Linux + #node + puppteer + headless Chrome で HTML to PDF 変換・スクリーンショット撮影をする。日本語対応。

# まとめ

– Chrome のバイナリをインストールする
– node API の puppeteer をインストールする
– Chrome バイナリのパスを指定して node の変換スクリプトを実行する

以上

# 環境

nodejs プラットフォーム の Web環境で試す

![image](https://user-images.githubusercontent.com/13635059/68536389-85525f80-0395-11ea-8ec0-821c3eb8bfae.png)

# ssh 接続する

`eb ssh `

# node install

なぜか入っていないのでインストールする。

“`
curl -sL https://rpm.nodesource.com/setup_10.x | sudo bash –
sudo yum install -y nodejs
“`

参考 https://linuxize.com/post/how-to-install-node-js-on-centos-7/

# puppet

元記事を表示

Node.js (3)ウェブサーバー連携

ウェブサーバー作る

先ずはhttp要求とport設定を書き込む、そして、node.jsのウェブサーバー機能を組み立てる。

“`app.js
var http = require(‘http’);
http.createServer(function (request,response){
//requestとresponseにつてデータ転送文ここに書く
.
.
.
}).listen(8080)

“`
テータ転送の基本の概念はブラウザからウェブサーバーにrequest請求を届く、request請求の中身はパケットですから、いろいろな転送データをここに入れる、反対の方向はresponse請求と言われる、response請求はウェブサーバーからブラウザにデータパケットを届いてブラウザの上にデータを表示する。

螢幕快照 2019-11-10 10.17.05.pngMacでパッケージ版Node.jsのアンインストール

# 概要

Mac OS Mojaveでパッケージ版Node.jsを。

# 環境

* Mac OS Mojave 10.14.6
* Node.js v4.5.0 (どんだけ古いねん!)

# 状況
1. 色々なサイトで書かれている下記ではNo such file or directoryエラー

“`
lsbom -f -l -s -pf /var/db/receipts/org.nodejs.node.pkg.bom \
| while read i; do
sudo rm /usr/local/${i}
done
“`

# 手順

“`
npm uninstall -g npm
sudo rm -rf /usr/local/lib/node_modules
sudo rm -rf ls /usr/local/include/node
sudo rm /usr/local/bin/node
sudo rm /usr/local/share/man/man1/node.1
sudo rm /usr/local/lib/dtrace/node.d
sud

元記事を表示

Node-REDのfunctionノードでjsライブラリをrequireする方法(備忘録)

# 概要
 Node-REDのfunctionノードで、jsライブラリ(node-module)を読み込んで使いたい場面が出てきました。

functionノードで直接”**require**”できないので苦戦し、なんとか利用できたので備忘録として残します。

# 方法
##1. ターミナルを開き利用したいライブラリをnpmでインストール
このとき、Node-REDのシステムファイルがある「**.node-red**」にインストールします。
 

“`
cd ~./.node-red
npm install インストールしたいライブラリ名
“`

例えば、fs-extraを読み込みたい場合は次のコマンドです。

“`
npm install fs-extra
“`

##2. settings.jsを編集
settings.jsは次の場所にあります。(windowsの場合)

“`
C:\Users\ユーザ名\.node-red\settings.js
“`

例)fs-extraを読み込む場合

“`javascript:settings.js
functionGlo

元記事を表示

「たった30秒でREST APIのモックが作れ」なかった話

こんにちは、wattak777です。

必要に迫られREST APIを受け付けられるダミーサーバを作ることになりまして、出来るだけ手抜きで効率よく構築する手段はないものか、と構築しようとして手抜きの目論見がバレたのか少々ハマった話を展開しておきます。

当初LinuxをDockerかVirtualBoxに入れてやるか、と考えていたのですが、手持ちのPCがWindows 10だったためそれも使わずに出来ないものか、と色々探して出てきたのがこれ(google先生は本当に便利ですね)。

JSON ServerでRestAPIのモックを作成した話

手持ちのPCがWindows 10が入っていたので、ここに書いてあるように、Node.jsをインストールし、npmでjson-serverを入れ、

“`json:db.json
{
“API_test”:
{
“param1”: “Apple”,
“para

元記事を表示

OTHERカテゴリの最新記事