• Visual Studio Code初识与自动化构建工具安装


    1.Visual Studio Code如何新建文件夹

    要自己手动在本地新建,然后再点击文件->打开文件夹即可。

    之后你就可以任意添加文件了

    2.如何使用自动化构建工具

    通过自动化构建工具,用户可以保存代码就可以看到前端效果,不需要一直刷新网页

    2.1首先要安装npm(包管理工具),下载地址如下

    https://www.npmjs.com/

    安装完之后在控制台输入 npm -v  和 node -v 看看安装成功没有

     

    2.2在控制台里面全局安装parcel

    键入命令:npm install -g parcel-bundler

     

    2.3大功告成

    3.功能试验

    3.1我新建了一个文件夹parcel_test

    3.2内容如下

    index.js,不引入js代码实时更新会失效。

    console.log("Hello World!")

    index.html

    <!DOCTYPE html>
    <html>
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <title></title>
        <!-- <link rel="stylesheet" href=""> -->
        <style>
            #app{
                color: red;
                width:200px;
                height: 200px;
                background-color: pink
            }
        </style>
    </head>
    <body>
        <div id="app">
            Hello world!
        </div>
    <script src="js/index.js"></script>
    </body>
    </html>

    3.3键入命令

    npm init -y 

    再输入parcel index.html

    按住ctrl打开localhost:1234

    这时候你就打开了网页,当你把style里的color修改时,不需要刷新网页就能看到效果。

  • 相关阅读:
    TCP之“3次握手,4次挥手”问题——实例分析
    TCP之“3次握手,4次挥手”问题
    IO
    select用法&原理详解(源码剖析)(转)
    select(),fd_set(),fd_isset()
    AF_INET与套接字SOCKET
    Socket 编程简介
    Spring 事务控制
    Spring-Profile详解
    Spring的常用使用场景
  • 原文地址:https://www.cnblogs.com/Java-Starter/p/8693346.html
Copyright © 2020-2023  润新知