Java script

Vue、angular 不要透過node.js的傳統做法

我們這種古代人,有時候(?)還是比較習慣傳統的js include的方式來寫前端

上面其實是假的…XD 只是有時候是真的需要免安裝的方式來碰vue 客戶不給安裝node.js 備註一下就是

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Vue.js 3.2.31 Demo</title>
    <script src="https://unpkg.com/vue@3.2.31/dist/vue.global.js"></script>
</head>
<body>
<div id="app">
    {{msg}}
</div>
<script>
    const App = {
        data() {
            return {
                msg: 'Hello Vue.js 3.2.31'
            }
        }
    }
    Vue.createApp(App).mount('#app')
</script>
</body>
</html>

下面是angular範例

<!DOCTYPE html>

<html>
<head>
    <title>First AngularJS Application</title>
    <script src= "10.angular.min.js"></script>
</head>
<body ng-app >
    <h1>First AngularJS Application</h1>

    Enter Numbers to Multiply: 
    <input type="text" ng-model="Num1" /> x <input type="text" ng-model="Num2" /> 
    = <span>{{Num1 * Num2}}</span>  
</body>
</html>

https://zh-hant.reactjs.org/docs/cdn-links.html

<!DOCTYPE html>
<html>
<head>
  <script src="react.development18.0.0.js"></script>  
  <script src="react-dom.development18.0.0.js"></script>  
</head>
<body>
  <div id="root">
    <!-- This element's contents will be replaced with your component. -->
</div>
  <script>
    const root=ReactDOM.createRoot(document.getElementById("root"));
    root.render(
  '<h1>1212, world!</h1>');


  </script>
</body>
Be the First to comment.

Leave a Comment

發佈留言必須填寫的電子郵件地址不會公開。 必填欄位標示為 *

(若看不到驗證碼,請重新整理網頁。)