質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.53%
Visual Studio Code

Visual Studio Codeとは、Microsoft社が開発したマルチプラットフォーム対応のテキストエディタです。Visual Studioファミリーの一員でもあります。拡張性とカスタマイズ性が高く、テキストエディタでありながら、IDEと遜色ない機能を備えることができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

解決済

2回答

490閲覧

VScodeでコーディングしたファイルを、アプリを閉じずにボタンひとつで保存したい!

genking0111

総合スコア1

Visual Studio Code

Visual Studio Codeとは、Microsoft社が開発したマルチプラットフォーム対応のテキストエディタです。Visual Studioファミリーの一員でもあります。拡張性とカスタマイズ性が高く、テキストエディタでありながら、IDEと遜色ない機能を備えることができます。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2022/12/04 04:44

VScodeでコーディングの勉強をし始めたのですが、、、

MacBookユーザーです。
セイト先生のYouTubeでJavascriptの勉強をしはじめ、使用しているエディタがVScodeなのですが、htmlファイルを作ってそこにコーディングしても結果が反映されません。
コーディングには何一つ問題がないので試しにfinderからもう一度htmlファイルを開いてみたら結果が反映されました。

皆さんはVScodeでコーディングして、結果を確認するために一度VScodeを閉じて保存して、もう一度finderからhtmlファイルを開いて結果を確認するなどという面倒臭い工程を繰り返しているのでしょうか?

実現したいこと

・VScodeでコーディングしたものをExcelやWordのようにボタンひとつで更新・保存したい。
・VScodeでコーディングした結果をすぐにブラウザを更新して知りたい。

ここに実現したいことを箇条書きで書いてください。

  • ▲▲機能を動作するようにする

発生している問題・エラーメッセージ

エラーメッセージ

該当のソースコード

ソースコード

試したこと

保存機能の拡張機能とか、「VScode 保存と出力 同時」とか調べましたが、当方ガチガチの初心者で何が何やらわかりません。。。
ここに問題に対して試したことを記載してください。

補足情報(FW/ツールのバージョンなど)

ここにより詳細な情報を記載してください。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

回答2

0

更新

Live Previewという拡張機能を使えば、保存しなくても変更がリアルタイムで確認できます
Live Preview

Live Refreshing
See the changes as you make them. By default, changes appear as you make them in the editor. You can also change this in settings to refresh the preview on save or not at all.

(変更した内容をそのまま表示デフォルトでは、エディターで変更を加えたときに、その変更が表示されます。保存時にプレビューを更新するか、全く更新しないかは、設定で変更することもできます。)

保存

保存はショートカットを覚えてキーボードでショートカットキー押下がいいと思いますが、保存用ボタンを作成する拡張機能があるようです。
Save Button
もしくは自動保存機能があります。
Save / Auto Save

投稿2022/12/04 06:11

編集2022/12/04 06:23
Crimson_Tide

総合スコア509

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

genking0111

2022/12/04 08:28

ありがとうございます、自分の検索のしかたが下手でその拡張機能にたどり着くことができませんでした汗 ありがとうございます!!
guest

0

ベストアンサー

htmlファイルを作ってそこにコーディングしても結果が反映されません。

保存するために VS Code を閉じる必要はなく Command+S キーを押せば VS Code を開いた状態のまま、アクティブになっているファイルを保存できます。

アクティブなタブ以外も一括して保存したい場合は、(特に設定をいじっていなければ)Option + Command + S キーで全部保存できるはずです。

保存した結果が自動的にブラウザに反映されるようにしたいなら、VS Code の拡張機能に Live Server をインストールすればいいのではないでしょうか。
https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer

インストールの仕方や使い方は「VSCode LIVE SERVER」で検索すればすぐ出てくるので省略します。

投稿2022/12/04 05:19

編集2022/12/04 06:39
退会済みユーザー

退会済みユーザー

総合スコア0

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

genking0111

2022/12/04 08:29

わかりやすい説明ありがとうございます!早速拡張機能をインストールして使ってみたいと思います!!
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.53%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問