---
# System prepended metadata

title: DAY18 - JavaScript 9. VsCode 建立 JavaScript 環境
tags: ['Re:0 前端工程師之路 - JavaScript 初級 篇章']

---

# DAY18 - JavaScript 9. VsCode 建立 JavaScript 環境

### 1. 建立一個 project 資料夾：

![](https://i.imgur.com/jhuTaXD.png)


### 2. 由 VScode 新建 HTML、JS 檔案：

- html 檔案命名: index.html
- JS 檔案命名: all.js


### 如何讓 HTML 網頁載入 JavaScript 檔案:

- 於 HTML 檔案中的 head 載入路徑:

- -> JS檔案 放在同層裡: js 資料夾，JS 檔案命名: all.js。

```
 <script src="js/all.js"></script>
```

### 如何確定網頁已成功載入 js ?

1. index 頁面，輸入 hello wrold!

![](https://i.imgur.com/e9TMyps.png)

2. js 檔案輸入以下資訊:

![](https://i.imgur.com/1D9af1B.png)


3. 打開 index.html，確定頁面有顯示 'hello world!'
   
![](https://i.imgur.com/ZEXVE7R.png)

4. 確定有，接下來打開 console:
   輸入 a,b 確定有撈到變數
   
    - 確定 a.b 皆能夠撈取正確，表示檔案連結正常!   
   
   
![](https://i.imgur.com/3TaEtw2.png)


###### tags: `Re:0 前端工程師之路 - JavaScript 初級 篇章`