webpack

最新推荐文章于 2024-07-28 00:56:04 发布
最新推荐文章于 2024-07-28 00:56:04 发布
阅读量611 收藏 4
点赞数 1
分类专栏： vue webapck 文章标签： vue webpack
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_44134725/article/details/113571710
版权
vue 同时被 2 个专栏收录
22 篇文章 0 订阅
订阅专栏
webapck
1 篇文章 0 订阅
订阅专栏

目录

一、webpack的概念和安装

1、安装node

2、npm安装webpack

二、webpack的使用

1、基本使用

2、webpack.config.js和package.json的配置

3、webpack中使用css的配置

4、less文件的处理

5、图片文件的处理

6、ES6转ES5的babel

7、引入vue

8、代码集：

9、Vue的el和template以及抽取

（1）抽取

（2）再次抽取

（3）最终抽取（.vue文件）

10、Plugin的使用 

（1）Bannerplugin：添加版权的插件

（2）HtmlWebpackPlugin：打包html的插件

（3）uglifyjs-webpack-plugin：js压缩的插件

11、webpack-dev-server搭建本地服务器

12、webpack配置文件的分离

 

一、webpack的概念和安装

-->概念

本质上来讲，webpack是一个现代的JavaScript应用的静态模块打包工具。

前端模块化打包工具

-->安装：

中文文档：https://webpack.docschina.org/concepts/

webpack本身依赖于node环境，

而node环境为了可以正常执行很多代码，其中包含很多依赖的包，所以一般在安装node时，会安装npm包管理工具（node packages manager）。

1、安装node

官方下载地址：https://nodejs.org/en/download/

历史版本：https://nodejs.org/en/download/releases/

我的电脑是win7的，不支持最新版本Node，这个版本的node支持win7 https://nodejs.org/dist/latest-v12.x/node-v12.20.1-x64.msi

 

2、npm安装webpack

配置npm的镜像（不然下载很慢很慢很慢）

常见的镜像：

淘宝npm镜像

cnpmjs镜像

cmd命令：

npm config set registry https://registry.npm.taobao.org

// 配置后可通过下面命令来验证是否成功

　npm config ls

// 此时：metrics-registry = "http://registry.npm.taobao.org/"表示设置成功

安装webpack

全局安装： npm install webpack@3.6.0 -g

本地安装：npm install webpack@3.6.0 --save-dev

安装成功

 

 

 

二、webpack的使用

1、基本使用

处理前的js文件

mathUtils.js

function add(n1, n2) {
    return n1 + n2;
}

function mul(n1, n2) {
    return n1 * n2;
}

export {mul,add}

main.js

import {add,mul} from "./mathUtils";

console.log(add(1,98));

执行打包处理：

webpack 要处理的js文件 处理之后的文件 

然后在html引用打包后的js文件

<script src="dist/bundle.js"></script>

 

2、webpack.config.js和package.json的配置

npm初始化，生成一个package.json

npm init

{
  "name": "02webpack",
  "version": "1.0.0",
  "description": "",
  "main": "webpack.config.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack"
  },
  "author": "",
  "license": "ISC",
  "devDependencies": {
    "webpack": "^3.6.0"
  }
}

然后配置webpack.config.js文件

const path = require('path')

module.exports={
    //入口
    entry:'./src/main.js',
    //出口
    output:{
        //动态的获取路径
        path:path.resolve(__dirname,'dist'),
        filename:'bundle.js',
    },
}

文件结构如下

然后输入webpack命令，就可以直接打包了。

或者，在package.json中定义

就可以使用npm run build进行执行命令，并且执行的webpack优先在本地找并允许（因为项目和项目的webpack版本可能不一样，所以优先使用本地的可能好一点）

 

3、webpack中使用css的配置

使用参考文档：https://www.webpackjs.com/loaders/css-loader/

（1）安装css的loader和style的loader

npm install --save-dev css-loader
npm install style-loader --save-dev

然后在webpack.config.js中的exports中添加

    module:{
        rules: [
            {
                test: /\.css$/,
                use: [
                    //使用多个loader时，是从右往左读取的
                    { loader: "style-loader" },
                    { loader: "css-loader" }
                ]
            }
        ]
    }
webpack.config.js

 

这个时候，package.json是这样的，注意，我们这里使用的是webpack3.6.0，因此css-loader版本应该使用2.0.2，版本太高也会报错。

{
  "name": "demo",
  "version": "1.0.0",
  "main": "webpack.config.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack"
  },
  "devDependencies": {
    "css-loader": "^2.0.2",
    "node-sass": "^5.0.0",
    "style-loader": "^2.0.0"
  },
  "dependencies": {
    "exports-loader": "^2.0.0"
  }
}

（2）在main.js中引用css

import {add,mul} from "./js/mathUtils";

//依赖css文件
require('./css/nomal.css');

console.log(add(1,98));

（3）执行webpack命令进行打包

 

4、less文件的处理

special.less

@fontSize:50px;
@fontColor:orange;

body{
  font-size: @fontSize;
  color: @fontColor;
}

（1）安装less loader、less

使用参考文档：https://www.webpackjs.com/loaders/less-loader/

npm install --save-dev less-loader less
module: {
        rules: [
            {
                test: /\.css$/,

                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.less$/,
                use: [{
                    loader: "style-loader" // creates style nodes from JS strings
                }, {
                    loader: "css-loader" // translates CSS into CommonJS
                }, {
                    loader: "less-loader" // compiles Less to CSS
                }]
            }
        ]
    }
注意版本

（2）引用less文件

//依赖less文件
require('./css/special.less');

（3）webpack打包

 

5、图片文件的处理

对应文档：https://www.webpackjs.com/loaders/url-loader/

（1）安装url-loader

npm install --save-dev url-loader
注意版本

webpack.config.js

注意调整limit的大小（限制图片的最大）

{
        test: /\.(png|jpg|gif)$/,
        use: [
          {
            loader: 'url-loader',
            options: {
               //但加载的图片小于limit时，会将图片以base64字符串格式
               //当加载的图片大于limit时，会使用file loader来进行加载，这个时候需要我们按照file loader
               //npm install --save-dev file-loader
              limit: 630000
            }
          }
        ]
      }

大于limit时要写接下来的配置

npm install --save-dev file-loader
file-loader的版本
webpack.config.js添加配置

（2）在css使用图片

body {
    /*background-color: lightpink;*/
    background: url("../pic/千姬.png");
}

（3）webpack

小于limit时

大于limit时

（4）解决图片命名问题

打包后的图片放在了pic下，并且名称重新命名

 

 

6、ES6转ES5的babel

（1）安装babel

官方文档https://www.webpackjs.com/loaders/babel-loader/

npm install babel-loader@8.0.0-beta.0 @babel/core @babel/preset-env webpack

{
      test: /\.js$/,
      exclude: /(node_modules|bower_components)/,
      use: {
        loader: 'babel-loader',
        options: {
          presets: ['@babel/preset-env']
        }
      }
    }

 

7、引入vue

（1）安装vue

npm install vue --save
指定使用vue-runtime-compiler，而不是runtime-only 
    //指定vue
    resolve:{
        //
        alias:{
            'vue$':'vue/dist/vue.esm.js',
        }
    }

（2）使用

import Vue from 'vue';

xxx.js

//引入vue
import Vue from 'vue';

const app = new Vue({
    el:'#demo',
    data:{
        message:'webpack使Vue',
    }
})

（3）webpack打包

 

8、代码集：

以上为止的项目代码

index.html

注意script的async设置

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Index</title>
    <script src="dist/bundle.js" async></script>
</head>
<body>
<div id="demo">
    <h2>123</h2>
    <h2>{{ message }}</h2>
</div>

</body>
</html>

webpack.config.js

const path = require('path')

module.exports = {

    //入口
    entry: './src/main.js',

    //出口
    output: {
        //动态的获取路径
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        publicPath: 'dist/',
    },

    //使用多个loader时，是从右往左读取的
    module: {
        rules: [
            {
                test: /\.css$/,

                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.less$/,
                use: [
                    {
                        loader: "style-loader" // creates style nodes from JS strings
                    }, {
                        loader: "css-loader" // translates CSS into CommonJS
                    }, {
                        loader: "less-loader" // compiles Less to CSS
                    },

                ]
            },
            {
                test: /\.(png|jpg|gif)$/,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            //但加载的图片小于limit时，会将图片以base64字符串格式
                            //当加载的图片大于limit时，会使用file loader来进行加载，这个时候需要我们按照file loader
                            //npm install --save-dev file-loader
                            limit: 63000,
                            name: 'pic/[name]_[hash:8].[ext]',
                        },

                    }
                ]
            },
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                }
            },
        ]
    },

    //指定vue
    resolve:{
        alias:{
            'vue$':'vue/dist/vue.esm.js',
        }
    }

}

main.js

import {add, mul} from "./js/mathUtils";

//依赖css文件
require('./css/nomal.css');

//依赖less文件
require('./css/special.less');

//引入vue
import Vue from 'vue';

const app = new Vue({
    el:'#demo',
    data:{
        message:'webpack使Vue',
    },

})

package.json

{
  "name": "test",
  "version": "1.0.0",
  "main": "webpack.config.js",
  "scripts": {
    "test": "echo \"Error: no test specified\" && exit 1",
    "build": "webpack"
  },
  "devDependencies": {
    "css-loader": "^2.0.2",
    "file-loader": "^3.0.1",
    "less": "^3.9.0",
    "less-loader": "^4.1.0",
    "node-sass": "^5.0.0",
    "style-loader": "^2.0.0",
    "url-loader": "^1.1.2",
    "webpack-cli": "^4.5.0"
  },
  "dependencies": {
    "@babel/core": "^7.12.13",
    "@babel/preset-env": "^7.12.13",
    "@babel/preset-es2015": "^7.0.0-beta.53",
    "babel-loader": "^8.0.0-beta.0",
    "exports-loader": "^2.0.0",
    "vue": "^2.6.12",
    "webpack": "^5.20.0"
  }
}

项目结构

 

9、Vue的el和template以及抽取

管理div时，不将html代码写到管理的容器中，而是写在template中，如下：

const app = new Vue({
    el: '#demo',
    template: `
			<div>
                <h2>123</h2>
                <h2>{{ message }}</h2>
			</div>
    `,
    data: {
        message: 'webpack使Vue',
    },

})

也是和之前的效果一致的，以此避免index.html频繁的修改。

el和template的区别：dom会将template里的代码“复制”到el管理的容器中；

（1）抽取

//引入vue
import Vue from 'vue';

const app = {
    template: `
			<div>
			<h2>123</h2>
			<h2>{{ message }}</h2>
            <button @click="clickTest">clickTest</button>
			</div>
    `,
    data() {
        return {
            message: 'webpack使Vue',
            name: 'rocke',
        }
    },
    methods: {
        clickTest() {
            console.log(this.name);
        }
    }
}

new Vue({
    el: '#demo',
    template:'<app></app>',
    components:{
        app
    }
})

（2）再次抽取

app.js

export default {
    template: `
			<div>
			<h2>123</h2>
			<h2>{{ message }}</h2>
			<button @click="clickTest">clickTest</button>
			</div>
    `,
    data() {
        return {
            message: 'webpack使Vue',
            name: 'rocke',
        }
    },
    methods: {
        clickTest() {
            console.log(this.name);
        }
    }
}

main.js

import Vue from 'vue';

import App from './vue/app'

new Vue({
    el: '#demo',
    template:'<app></app>',
    components:{
        App
    }
})

（3）最终抽取（.vue文件）

app.vue

<template>
	<div>
		<h2 class="title">123</h2>
		<h2>{{ message }}</h2>
		<button @click="clickTest">clickTest</button>
	</div>
</template>

<script>
export default {
	data() {
		return {
			message: 'webpack使Vue',
			name: 'rocke',
		}
	},
	methods: {
		clickTest() {
			console.log(this.name);
		}
	}
}
</script>

<style scoped>
	.title{
		color: green;
	}
</style>

配置对应的loader：

npm install vue-loader vue-template-compiler --save-dev
注意vue-loader版本，v15的需要另外下插件

webpack.config.js

        {
                test: /\.vue$/,
                use: ['vue-loader'],
            },

main.js

import App from './vue/app.vue'

new Vue({
    el: '#demo',
    template:'<app></app>',
    components:{
        App
    }
})

 

 

10、Plugin的使用 

  1. 通过npm安装需要使用的插件（有一些内置的插件不需要安装）
  2. 在webpack.config.js中配置插件

（1）Bannerplugin：添加版权的插件

属于自带插件

在webpack.config.js配置

  const webpack = require('webpack')
 

 //插件
    plugins:[
        new webpack.BannerPlugin('最终版权归rocke所有'),
    ],

（2）HtmlWebpackPlugin：打包html的插件

  • 自动生成一index.html文件，可以指定模板来生成
  • 将打包的js文件，自动通过script标签插入到body中

安装：

npm install html-webpack-plugin --save-dev

配置：

   const HtmlWebpackPlugin = require('html-webpack-plugin')

 //插件
    plugins:[
        new HtmlWebpackPlugin({
            template:'index.html'
        })
    ],

效果：

 

（3）uglifyjs-webpack-plugin：js压缩的插件

开发阶段不建议开启这个压缩功能

安装：

npm install uglifyjs-webpack-plugin --save-dev

配置：

const Uglifyjs = require('uglifyjs-webpack-plugin')

效果：

 

11、webpack-dev-server搭建本地服务器

webpack提供了一个可选的本开发服务器，这个服务器是基于node.js搭建的，内部使用express框架，可以实现我们想让浏览器自动刷新显示我们修改后的结果。

安装：

npm install --save-dev webpack-dev-server

注意版本：webpack-dev-server3.11.x对应webpack-cli的3.x

配置：

webpack.config.js中和plugin、resolve同目录

    //webpack-dev-server
    devServer:{
        //contentBase:指定要服务的文件夹，不写默认是根文件夹
        contentBase:'./dist',
        //inline:是否实时监听
        inline:true,
        //port:端口号 默认8080
        port:8080,
        //historyApiFallback:在SPA页面中，依赖HTML5的history模式
        //historyApiFallback:
    }

启动服务：

 

12、webpack配置文件的分离

将开发时的配置和项目打包运行时的配置分离开

配置文件的分离：

安装：

npm install webpack-merge  --save-dev

配置分离

base.config.js

const path = require('path')
const HtmlWebpackPlugin = require('html-webpack-plugin')

module.exports = {
    //入口
    entry: './src/main.js',

    //出口
    output: {
        //动态的获取路径
        path: path.resolve(__dirname, 'dist'),
        filename: 'bundle.js',
        //publicPath: 'dist/',
    },

    //使用多个loader时，是从右往左读取的
    module: {
        rules: [
            {
                test: /\.css$/,

                use: ['style-loader', 'css-loader']
            },
            {
                test: /\.less$/,
                use: [
                    {
                        loader: "style-loader" // creates style nodes from JS strings
                    }, {
                        loader: "css-loader" // translates CSS into CommonJS
                    }, {
                        loader: "less-loader" // compiles Less to CSS
                    },

                ]
            },
            {
                test: /\.(png|jpg|gif)$/,
                use: [
                    {
                        loader: 'url-loader',
                        options: {
                            //但加载的图片小于limit时，会将图片以base64字符串格式
                            //当加载的图片大于limit时，会使用file loader来进行加载，这个时候需要我们按照file loader
                            //npm install --save-dev file-loader
                            limit: 63000,
                            name: 'pic/[name]_[hash:8].[ext]',
                        },

                    }
                ]
            },
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['@babel/preset-env']
                    }
                }
            },
            {
                test: /\.vue$/,
                use: ['vue-loader'],
            },
        ]
    },

    //指定vue
    resolve:{
        extensions:['.js','.vue'],
        alias:{
            'vue$':'vue/dist/vue.esm.js',
        }
    },

    //插件
    plugins:[
        new HtmlWebpackPlugin({
            template:'index.html'
        }),

    ],

}

dev.config.js

const WebpackMerge = require('webpack-merge')
const baseConfig = require('./base.config')

module.exports = WebpackMerge.merge(baseConfig, {
    devServer: {
        contentBase: './dist',
        inline: true,
        port: 8080,
    }
})

prod.config.js

const webpack = require('webpack')
const Uglifyjs = require('uglifyjs-webpack-plugin')
const WebpackMerge = require('webpack-merge')
const baseConfig = require('./base.config')

module.exports = WebpackMerge.merge(baseConfig, {
    plugins: [
        new webpack.BannerPlugin('最终版权归rocke所有'),
        new Uglifyjs(),
    ],
})

使用配置文件：

这里的打包路径需要修改

 

 

 

 

 

 

 

 

 

 

 

这次又写信给哪位
关注
  • 1
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 2
    评论
专栏目录
webpack的使用，看这一篇就够了
m0_51060602的博客
03-17 2887
学 webpack 看这一篇就够了
Webpack中@的原理和用法
m0_63400611的博客
05-08 1674
在 webpack 中,可以在 webpack.config.js 文件中配置如下命令,使 @ 在代码中表示指定的路径 module.exports = { resolve: { alias: { //在 webpack 中设置代码中 @ 符号表示 src 这一层目录 '@': path.join(__dirname, './src/') } } } 之后在文件中使用的示例: import msg from '@/msg' //建议使用 @ 表示src源代码目录 从
Webpack--入门只看这一篇就够了(图文＋代码）
最新发布
weixin_46714216的博客
07-28 2142
代码分离（code splitting）和懒加载（lazy loading）是Webpack中用于优化资源加载的两种技术。代码分离是将打包生成的代码文件拆分成多个较小的文件，而不是将所有代码打包到一个文件中。这样做的好处是可以提高初始加载速度，并减小每个页面的加载所需的数据量。通过代码分离，只需在需要时加载特定模块，提高了页面的响应速度和用户体验。懒加载是指在需要时才加载某个模块，而不是在初始加载时就将所有代码一次性加载完毕。通过懒加载，可以将页面分成多个模块，并根据需要动态地加载模块。
webpack打包文件中的@符号表示什么意思
weixin_30781775的博客
07-02 284
　　在看使用webpack打包的项目代码时，经常会看到在路径中引用@符号 import one from '@/views/one.vue' 　　 　　那这里的@符号到底表示什么意思呢？ 　　这其实利用了webpack的resolve.alias特性，webpabk.config.js的配制代码如下，在webpack打包时，会把路径引用中的@符号，转换为相对应的路...
npm i webpack -g npm install webpack -g
qq_50532732的博客
11-21 669
npm install webpack -g 解决方案 ：使用管理员身份运行命令提示符。
Webpack - @ 和 ~ 区别
牧码的博客
02-11 4491
@ @这是webpack设置的路径别名。 这东西在vue标准模板里面的 build/webpack.base.conf 这个文件里面。 resolve: { // 路径别名 alias: { '@': resolve('src'), 'vue$': 'vue/dist/vue.esm.js' } } 就是说@这东西代表着到src这个文件...
vue init webpack 依赖的webpack包
09-05
解决vue-cli · Failed to download repo vuejs-templates/webpack: connect ETIMEDOUT 20.205.243.166:443问题，方便在https://github.com/vuejs-templates/webpack 不通的时候下载。 使用方法： 1、将webpack放到C...
若依vue3,基于webpack(非vite版本)
01-02
2. **Webpack**: Webpack的核心概念是模块化，它通过配置文件（webpack.config.js）来定义如何处理不同类型的文件。Webpack的主要任务包括：模块解析、加载、编译和打包。它支持预处理器（如Sass/LESS for CSS）和后...
手把手搭建h5框架,webpack+jq 与webpack +vue
11-21
手把手搭建h5框架,webpack+jq 与webpack +vue。 1.初始化一个npm项目 2.安装pnpm 3.安装webpack webpack-cli 4.新建webpack.config.js配置文件 5.安装babel 详细安装方式，手把手教程见README.md文档
webpack-develop.zip
11-01
Vue CLI（命令行接口）是官方提供的脚手架工具，它极大地简化了Vue项目的初始化过程，包括设置webpack配置、安装依赖等。在"webpack-develop.zip"这个压缩包中，我们很可能是找到了一个使用Vue CLI 3搭建的开发环境...
webpack（四）：webpack配置
wangdongm123的博客
01-16 310
4.1入口和出口   如果每次使用webpack的命令都需要写上入口和出口作为参数，就非常麻烦，有没有一种方法可以将这两个参数写到配置中，在运行时，直接读取呢？   当然可以，就是创建一个webpack.config.js文件（文件名字固定，不能随便取） webpack.config.js文件内容： path需要动态获取路径，这里要用到node的语法，首先要导出path的模块，会去node的包...
webpack里面`./`和`@/`的区别
洋成林
01-16 2308
importHellofrom'@/components/Hello'; importHellofrom'./components/Hello'; 上面语句中的@和.的区别: ./这是相对路径的意思。@/这是webpack设置的路径别名。 @是webpack配置的引用路径，resolve里面有一个alias的配置项目， 能够让开发者指定一些模块的引用路径。对一些经常要被i...
Webpack的概念和基本使用
weixin_60524655的博客
05-14 2014
1、webpack的概念 一、什么是webpack 概念：webpack 是前端项目工程化的具体解决方案。 主要功能：它提供了友好的前端模块化开发支持，以及代码压缩混淆、处理浏览器端 JavaScript 的兼容性、性 能优化等强大的功能。 好处：让程序员把工作的重心放到具体功能的实现上，提高了前端开发效率和项目的可维护性。 注意：目前 Vue，React 等前端项目，基本上都是基于 webpack 进行工程化开发的 二、webpack有四个核心概念 入口(entry)：口起点(ent...
webpack安装与使用
IT菜鸟
06-09 1413
webpack安装与使用
webpack看这一篇就够了
热门推荐
一个前端开发者
06-20 5万+
能够理解webpack基本概念和作用能够掌握webpack使用步骤能够使用webpack相关配置能够使用webpack开发服务器能够查阅使用webpack中文文档webpack官网现代 javascript 应用程序的 静态模块打包器 (module bundler)为要学的 vue-cli 开发环境做铺垫把很多文件打包整合到一起, 缩小项目体积, 提高加载速度其中功能:less/sass -> cssES6/7/8 -> ES5 处理js兼容支持js模块化处理css兼容性html/css/js -> 压缩
webpack安装配置
m0_37549178的博客
06-18 83
一. 先看装没装Node.js node -v 二.全局安装webpack vue cli2依赖3.6.0版本 vue cli 3及以上就安最新就行 npm install webpack@3.6.0 -g //检查是否安装成功 webpack --version 三.配置webpack.config.js 解决webpack打包的时候每次都要写打包哪个文件到哪 //为了解决每次都写这个 webpack ./src/main.js ./dist/bundle.js //改成写 ```javascri
npm install webpack报错if you are behind a proxy,please make sure that the proxy cinfig is setproperly
Tempta的博客
03-05 2万+
npm install webpack -g报错if you are behind a proxy,please make sure that the 'proxy' cinfig is set properly. 错误信息提示：若配置了代理，请确认代理被合理配置。因此去设置npm代理 执行npm config set proxy http://proxy.example.com:8080 参考...
code ERESOLVE， ERESOLVE could not resolve
qq_46199553的博客
02-04 2714
npm ERR! code ERESOLVE npm ERR! ERESOLVE could not resolve npm ERR! npm ERR! While resolving: biyedurg@0.1.0 npm ERR! Found: webpack@4.46.0 npm ERR! node_modules/webpack npm ERR! peer webpack@"^4.0.0" from @intervolga/optimize-cssnano-plugin@1.0.6 npm ER
Webpack入门与安装指南
"Webpack学习笔记是一个详细的指南，介绍了webpack的基本概念、安装方法以及配置过程。主要涵盖以下几个知识点： 1. 模块打包工具： Webpack是一个强大的模块打包工具，它支持两种模块导入规范：ESmodule（如`...
评论 2
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值