{ "version": "0.2.0", "configurations": [ { "name": "Launch", "type": "chrome", "request": "launch", "file": "${workspaceRoot}/index.html", "runtimeArgs": [ "--allow-file-access-from-files", "--remote-debugging-port=9222", "--autoplay-policy=no-user-gesture-required" ] } ] }
{ "compilerOptions": { "module": "commonjs", "target": "es5", "outDir": "dist", "lib": [ "es5", "es2015.promise" ] } }
git config --global user.name {自分の名前}
git config --global user.email {メールアドレス}
git remote add origin https://github.com/{ユーザー名}/{リポジトリ名}.git
git remote -v
origin https://github.com/{ユーザー名}/{リポジトリ名}.git (fetch)
origin https://github.com/{ユーザー名}/{リポジトリ名}.git (push)
git branch -M main
git push -u origin main
'use strict'; if (require.main === module) { main() } function main() { console.log('Hello, world!') }
npm install @tensorflow-models/posenet以下のリンク先のGithHubにインストール時のnpmコマンドが載っている
プロジェクトフォルダ │ index.ts (自分で作成した TypeScript ファイル) │ index.js (デバッグ実行で出力された index.ts) │ package.json (npm init -y で生成) │ tsconfig.json (tsc --init で生成) │ └─.vscode launch.json (「起動設定」で生成) tasks.json (「ビルドタスクの設定」で生成)
npm init
package name: (test)
version: (1.0.0)
description:
entry point: (index.js)
test command:
git repository:
keywords:
author:
license: (ISC)
npm init -y
tsc --init
{ "compilerOptions": { /* Basic Options */ //基本オプション //どのバージョンでjsを出力するか? //ES6(新しいJavaScript)を指定する "target": "ES6", //出力するjsのモジュールの仕組みとして何を使用するかを指定する。 //ES2015は上で指定したES6 "module": "ES2015", //ソースマップ、デバッグが捗る? "sourceMap": true, //何も指定しない場合、コンパイルされたjsはコンパイルしたtsファイルと同じディレクトリに作成される。 //このオプションでディレクトリを指定した場合、tsファイルのディレクトリ構成をそのままに保ちつつ、指定したディレクトリにjsファイルを作成する。 "outDir": "./dist", //コンパイル結果をoutDirで出力する際に、どのディレクトリ配下のディレクトリ構造で出力するかを指定する "rootDir": "./src", "removeComments": true, "noEmitOnError": true, /* Strict Type-Checking Options */ "strict": true, /* Additional Checks */ "noUnusedLocals": true, "noUnusedParameters": true, "noImplicitReturns": true, /* Module Resolution Options */ "esModuleInterop": true, /* Experimental Options */ "experimentalDecorators": true, /* Advanced Options */ "skipLibCheck": true, "forceConsistentCasingInFileNames": true } }
npx tsc --init
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <script src="dist/app.js" defer></script> <title>Document</title> </head> <body></body> </html>
console.log('Hello, TypeScript');
tsc
npm install @tensorflow/tfjs @tensorflow-models/mobilenet
myProject ├── dist //追加したフォルダ ├── node_modules ├── package-lock.json ├── package.json └── src //追加したフォルダ └── modules //追加したフォルダ過程2(webpackでのバンドル前)
myProject ├── dist │ └── index.html //追加したファイル ├── node_modules //npm でインストールされるパッケージ(webpack 等) ├── package-lock.json ├── package.json └── src ├── index.js //追加したファイル(エントリポイント) └── modules └── foo.js //追加したファイル(モジュール)過程3(webpackでのバンドル後)
myProject ├── dist │ ├── index.html │ └── main.js //webpack によりまとめられた JavaScript ファイル ├── node_modules ├── package-lock.json ├── package.json └── src ├── index.js └── modules └── foo.js
module.exports = { }
module.exports = { entry: path.resolve(__dirname, "entry.js"), }例2
module.exports = { entry: { main: './path/to/my/entry/file.js' } };
const path = require('path'); //path モジュールの読み込み module.exports = { entry: './path/to/my/entry/file.js', output: { // output プロパティ path: path.resolve(__dirname, 'dist'), //出力ファイルのディレクトリの絶対パス filename: 'my-first-webpack.bundle.js' //出力ファイルの名前 } };
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope Process参考1:PowerShellでこのシステムではスクリプトの実行が無効になっているため、ファイル hoge.ps1 を読み込むことができません。となったときの対応方法
found 1 high severity vulnerability以下のコマンドでパッチを当てる
npm audit fix
npm install パッケージ
npm i パッケージ
npm add パッケージ
npm install --save パッケージ名
npm install -save パッケージ名
npm install -S パッケージ名
npm install --save-dev パッケージ名
npm install -D パッケージ名