webpack.config.js与package.json文件的配置

最新推荐文章于 2024-03-09 18:02:31 发布
最新推荐文章于 2024-03-09 18:02:31 发布
阅读量505 收藏
点赞数
分类专栏： vue学习 文章标签： 前端 html css vue.js 开发语言
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_54327001/article/details/129268067
版权

 

path要使用绝对路径，通过每次复制文件位置非常麻烦且容易导致问题

使用node中的

 

写个包名跟入口名称，其他全部回车 

 此步完成后，自动生成一个package.json包

 licence指的是开源，一般不写

 安装文件夹需要的依赖

dirname是node自带的 

 此处webpack指令是快速打包，就不需要写那一串路径

将入口出口放在配置文件里面，无需每次写入口出口

但是实际开发中 不使用webpack，使用run bulid

这是全局的

 此处是本地的webpack，因为全局跟局部的webpack可能版本不同

 webpack是开发时依赖，打包后就无用了

-devnode

上为开发时依赖，后为运行时依赖

 

 优先使用本地webpack，本地没找到才去全局

但是终端中都是全局的webpack指令

这才是局部的webpack 

usrname为username
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
webpack详细安装以及webpack.config.js配置，package.json配置
qq_48770086的博客
05-26 2792
webpack详细安装以及webpack.config.js配置，package.json配置
webpack.config.js配置和package.json配置
Rodstrupe的博客
08-31 274
webpack.config.js配置和package.json配置 新建文件：新建html文件，如index.html dist：用于存放打包之后的文件，如bundle.js src：用于存放源文件，如main.js webpack.config.js（名字固定）：入口——./src/main.js，出口——需要动态获取绝对路径，依赖node语法中的path包，接下来安装包 初始化：npm init 执行初始化后，生成package.json，如果package.json再依赖Node
webpack在package.json的配置
最新发布
qq_41865743的博客
03-09 103
1. 我们可以在packagejson的scripts中定义自己的执行脚本。通过npminit初始化，生成package.json，npm包管理的文件(暂时没有用上，后面才会用上)npm init2. package.json中的scripts的脚本在执行时，会按照一定的顺序寻找命令对应的位置。首先，会寻找本地的node_modules/.bin路径中对应的命令。如果没有找到，会去全局的环境变量中寻找执行我们的build指令
第七步 Webpack 配置多环境和全局变量 cross-env 和 webpack.DefinePlugin
mebell的专栏
09-18 1538
一般情况下我们需要多个环境如：开发dev测试test预发布release正式build，每个环境有自己的独立api接口请求地址。此时我们就需要使用cross-env命令设置环境变量。
webpack之webpack.config.js配置
热门推荐
chen4565的博客
06-21 2万+
webpack之webpack.config.js配置 wbepack.config.js webpack的配置文件详解: ​ 作用: 指示 webpack 干那些活(当你运行 webpack 指令时, 会加载里面的配置) ​ 所有构建工具都是基于node.js平台运行的~模块化默认采用commonjs, ​ 概念:我们创建的src文件是我们写项目的源代码,用的是ES6模块化 ​ 而wbepack.config.js文件是我们写配置的源代码,默认用的是commonjs  
Webpack配置详解（package.json/webpack.config.js详细配置 ）
时清云的博客
12-17 9444
Webpack配置详解（package.json/webpack.config.js详细配置 ） webpack安装 package.json配置以及模块安装 webpack.config.js配置 开启webpack-dev-server服务 热替换插件的安装以及配置 开启自动打开浏览器插件的安装以及配置 加载器的安装以及配置 完整package.json/webpack.config.js文件...
webpack.config.js配置文件注释
开发路上的AZhe
10-24 279
webpack.config.js //nodejs的内置模块 先使用npm init初始化项目 const path = require("path"); //引入webpack模块（使用plugins） const webpack = require('webpack'); //用来自动生成dist目录下的index.html页面代码 const htmlWebpackPlugin =require('html-webpack-plugin'); //用来丑化代码 const uglifyjsWe
vue2 + webpack5相适配的 能成功打包的 package.json 文件
08-25
vue2 项目 + webpack 打包工具，是一个非常经典的组合，但是在...小记：这只是配置的 package.json 文件，更有配置好的 webpack.config.js 文件，以及整个完整的 vue2+webpack5 整个的项目，因为上传的规定可以找我来拿
vue2 + webpack4相适配的 能成功打包的 package.json 文件
08-25
vue2 项目 + webpack 打包工具，是一个非常经典的组合，但是在...小记：这只是配置的 package.json 文件，更有配置好的 webpack.config.js 文件，以及整个完整的 vue2+webpack4 整个的项目，因为上传的规定可以找我来拿
package.json配置文件构成详解
01-02
1.项目基础信息 name: XXXXXXX, version: 1.0.0, description: A Vue.js ... dev: webpack-dev-server --inline --progress --config build/webpack.dev.conf.js, start: npm run dev, build: node build/b
webpack-config-reload:热加载 webpack 配置。修改 webpack 相关配置文件后，自动重启脚本命令，比如 dev-server
05-05
修改 webpack 相关配置文件后，自动重启脚本命令，比如 dev-server，比较方便的是在调试 webpack 繁琐的配置时候，省去一遍遍地 Ctrl+c 和重复输入命令。 注意：只支持 webpack/webpack-dev-server 两个命令。 安装...
webpack配置文件.zip
04-15
自动构建vue脚手架的webpack配置文件，包括三个文件package.json、package-lock.json、webpack.config.js，使用说明在文件里面的webpack.config.js里面，
webpack4-react-starter:Webpack 4 教程：零配置 基础实现, 复杂实现还需要使用webpack.config.js
04-28
但是要实现复杂的工程还是要config定义比较好package.json -> scripts ->webpack --mode development ./src/index.js --output ./dist/main.js --module-bind js=babel-loader 参数描述mode 编译模式 development ...
webpack-guides：webpack.js.org指南的通读
02-11
我们安装时没有package.json。入门由于我们在此处执行npm init，因此卸载了在“安装”部分中执行的操作。 创建了index.html和index.js。 我们将npm包设为私有。 我们的脚本设置方式很糟糕！ 我们的脚本之间有强制性...
vue3.0 vue.config.js 配置实战.docx
11-22
这个文件需要与 `package.json` 文件一样的目录层级。 在 `vue.config.js` 文件中，我们可以设置项目的基础路径、输出文件的路径、静态资源的路径等参数。例如： ```javascript module.exports = { // 项目部署的...
package.json文件配置说明
Skty_ywh的博客
03-21 4873
package.json文件是Node.js项目中的一个描述文件，执行npm init命令初始化项目后，在项目的根目录下自动生成该文件。
webpack的一些常用打包配置
蓝胖子的博客
10-12 4207
webpack的一些常用打包配置
package.json配置
qq_18231839的博客
07-08 4722
package.json配置选项记录，使用心得
Vue中的webpack打包（重点：webpack.config.js与package.json）
qq_51066068的博客
06-05 1104
Vue中的webpack打包（重点：webpack.config.js与package.json）
webpack3.6.0版本中的webpack.config.js 怎么配置
09-08
在webpack3.6.0版本中，可以按照以下步骤配置webpack.config.js： 1. 首先，确认你已经安装了webpack3.6.0版本。可以使用以下命令进行安装：npm install webpack@3.6.0 -save-dev 。 2. 在项目根目录下新建一个build文件夹，用于存放webpack相关的配置文件。 3. 在build文件夹下创建一个名为webpack.config.js的文件，这个文件用来配置webpack。 4. 打开webpack.config.js文件，根据你的项目需求，进行相应的配置。具体的配置内容可以参考codewhy的webpack视频第90集或者官方文档。 5. 确保在package.json文件中的"scripts"字段中有以下配置： "build": "webpack --config ./build/webpack.config.js" "dev": "webpack-dev-server --open --config ./build/webpack.config.js" 6. 运行npm run build命令来执行webpack打包操作，运行npm run dev命令来启动webpack开发服务器。 请注意，以上配置是基于vue-cli的写法，如果你是使用vue-cli3版本，也可以在项目根目录下创建一个名为vue.config.js的文件来配置webpack。具体的配置参考官方文档：https://cli.vuejs.org/zh/config/ 。 希望以上信息对你有所帮助！如果还有其他问题，请随时提问。<span class="em">1</span><span class="em">2</span><span class="em">3</span><span class="em">4</span>

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值