zoukankan      html  css  js  c++  java
  • webpack安装教程及实例

    在控制台输入:

    npm install webpack -g

    这是全局的安装,如果需要局部安装,在控制台cd 打开到指定目录,输入:

    npm install webpack --save-dev

    即可。

    实例:

    1. 建立index.html文件
    2. 建立main.js文件
    3. 建立webpack.config.js文件

    index.html

    <html lang="en">
     
    <head>
        <title></title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
     
    </head>
     
    <body>
        <script type="text/javascript" src="bundle.js"></script>
    </body>
     
    </html>

    main.js

    document.write("<h1>Hello World</h1>");

    webpack.config.js

    module.exports = {
        entry: "./main.js",//这是源文件
        output: {
            filename: 'bundle.js' //这是生成的新文件
        }
    };

    三个文件创建好之后,我们需要把项目运行起来,使用live-server来运行项目。

    在控制台直接输入:

    npm install live-server -g

    安装成功之后,在控制台cd打开到项目的根目录,然后在控制台先输入webpack命令,webpack就是执行打包指令,打包成功之后,

    在控制台输入:

    live-server

    即可运行项目。

  • 相关阅读:
    uva 10881
    uva 1388
    【USACO 3.2.5】魔板
    【USACO 3.2.4】饲料调配
    【USACO 3.2.3】纺车的轮子
    【USACO 3.2.2】二进制数01串
    【USACO 3.2.1】阶乘
    【USACO 3.1.6】邮票
    【USACO 3.1.5】联系
    【USACO 3.1.4】形成的区域
  • 原文地址:https://www.cnblogs.com/Mrrabbit/p/7278226.html
Copyright © 2011-2022 走看看