【自作アプリ】異名ジェネレータ：追加機能作成中　その４　エラー遭遇中

作戦を切り替え。

translate-google は、CDNでも配布されているので、そっちを使ってみる事にする。
translate-google

<script src="https://cdn.jsdelivr.net/npm/translate-google@1.3.5/index.min.js"></script> を追加。

エラー出た。

Uncaught ReferenceError: require is not defined at index.min.js:7

何だこれ。

/**
 * Minified by jsDelivr using Terser v3.14.1.
 * Original file: /npm/translate-google@1.3.5/index.js
 * 
 * Do NOT use SRI with dynamically generated files! More information: https://www.jsdelivr.com/using-sri-with-dynamic-files
 */
"use strict";const _=require("lodash"),isUrl=require("is-url"),　　・・・・中略

分からん。minじゃない方をコールしてみよう。

/*
* @Author: shikar
* @Date:   2017-02-05 15:28:31
* @Last Modified by:   shikar
* @Last Modified time: 2019-01-12 11:40:29
*/
'use strict'
const _ = require("lodash")

Uncaught ReferenceError: require is not defined

これ。
冒頭でいきなりエラーってる。

ナンデスカ lodash って。
これ？
lodash

色々便利らしい。
【JavaScript】lodashの使い方

CDNでも配布しているみたい。
https://www.jsdelivr.com/package/npm/lodash

<script src="https://cdn.jsdelivr.net/npm/lodash@4.17.11/lodash.min.js"></script> を追加してみようかしら。

エラーメッセージ、変わらず。

というか、よく読んだら・・いや、よく読まなくても、エラーの箇所って「require」そのものやんけ！

ってことで調べたらこんなのあった。
require is not definedを解消してrequireを使えるようにする

理由は、ブラウザー/クライアントサイドのJavaScriptではrequireは使えないことにあります。 学習コストの低そうな解決法としては以下の二つ。

• script タグを使う
• browserifyを使う

ええええ！！！　script タグ使ってるのに何で！？　ってか、CDNって、↑みたいな問題を解決したうえで配布してくれてるわけじゃないの？

仕方ない。次の作戦だ。
CDNで配布されてる translate-google をローカルに落とし、それを scriptタグで取り込む！
・・・フロントエンドの進化の逆を辿っているような・・まぁいいか。

translate-google@1.3.5/index.js

const _ = require("lodash")
const isUrl = require("is-url")
const isNumber = require("num-or-not")
const isKeyword = require('is-keyword-js')
const querystring = require('querystring')
const got = require('got')
const safeEval = require('safe-eval')
const userAgents = require("user-agents")
const token = require('./token')
const languages = require('./languages')

あ、無理。
これ、絶対にこのファイル１個だけローカルに落としただけでは使えない奴だ。

npm の出番か。

さすがに検証は別にフォルダ作ってからにしよう。
という事で

npm init
npm install --save translate-google

その後、

<script src="./node_modules/translate-google/index.js"></script>

を追加。

しかし、エラーメッセージの内容は変わらず。
この方法でもダメか。。。

仕方ない。最後の手段だ。