vue3 项目中如何输出webpack的config.js

这篇博客详细记录了在Vue3项目中获取Webpack配置的步骤,包括使用`vue-cli-service inspect`命令以及遇到的问题,如`vue-cli-plugin-babel`和`vue-loader-v16`的缺失,通过`cnpm i -g`全局安装这些依赖后,成功生成了`output.prod.js`文件。
摘要由CSDN通过智能技术生成

这个配置文件的获取方法:

Microsoft Windows [版本 10.0.16299.1932]
(c) 2017 Microsoft Corporation。保留所有权利。

C:\Users\easygoo>d:

D:\>cd vue3\case1

D:\vue3\case1>dir
 驱动器 D 中的卷是 V9
 卷的序列号是 96FC-9BAC

 D:\vue3\case1 的目录

2021-05-29  18:12    <DIR>          .
2021-05-29  18:12    <DIR>          ..
2021-05-29  08:19               231 .gitignore
2021-05-29  08:19                73 babel.config.js
2021-05-29  18:12    <DIR>          dist
2021-05-29  17:38    <DIR>          node_modules
2021-05-29  08:20           474,025 package-lock.json
2021-05-29  17:38               855 package.json
2021-05-29  08:19    <DIR>          public
2021-05-29  08:20               317 README.md
2021-05-29  08:19    <DIR>          src
               5 个文件        475,501 字节
               6 个目录 120,330,248,192 可用字节

D:\vue3\case1>vue-cli-service inspect
internal/modules/cjs/loader.js:888
  throw err;
  ^

Error: Cannot find module '@vue/cli-plugin-babel'
Require stack:
- D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js
- D:\nodejs\node-global\node_modules\@vue\cli-service\bin\vue-cli-service.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:885:15)
    at Function.Module._load (internal/modules/cjs/loader.js:730:27)
    at Module.require (internal/modules/cjs/loader.js:957:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at idToPlugin (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:145:14)
    at D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:184:20
    at Array.map (<anonymous>)
    at Service.resolvePlugins (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:170:10)
    at new Service (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:32:25)
    at Object.<anonymous> (D:\nodejs\node-global\node_modules\@vue\cli-service\bin\vue-cli-service.js:15:17) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'D:\\nodejs\\node-global\\node_modules\\@vue\\cli-service\\lib\\Service.js',
    'D:\\nodejs\\node-global\\node_modules\\@vue\\cli-service\\bin\\vue-cli-service.js'
  ]
}

D:\vue3\case1>vue-cli-service inspect --mode production
internal/modules/cjs/loader.js:888
  throw err;
  ^

Error: Cannot find module '@vue/cli-plugin-babel'
Require stack:
- D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js
- D:\nodejs\node-global\node_modules\@vue\cli-service\bin\vue-cli-service.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:885:15)
    at Function.Module._load (internal/modules/cjs/loader.js:730:27)
    at Module.require (internal/modules/cjs/loader.js:957:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at idToPlugin (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:145:14)
    at D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:184:20
    at Array.map (<anonymous>)
    at Service.resolvePlugins (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:170:10)
    at new Service (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:32:25)
    at Object.<anonymous> (D:\nodejs\node-global\node_modules\@vue\cli-service\bin\vue-cli-service.js:15:17) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'D:\\nodejs\\node-global\\node_modules\\@vue\\cli-service\\lib\\Service.js',
    'D:\\nodejs\\node-global\\node_modules\\@vue\\cli-service\\bin\\vue-cli-service.js'
  ]
}

D:\vue3\case1>vue inspect > output.js

D:\vue3\case1>vue inspect --mode production > output.prod.js

D:\vue3\case1>vue-cli-service inspect --mode production > output.prod.js
internal/modules/cjs/loader.js:888
  throw err;
  ^

Error: Cannot find module '@vue/cli-plugin-babel'
Require stack:
- D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js
- D:\nodejs\node-global\node_modules\@vue\cli-service\bin\vue-cli-service.js
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:885:15)
    at Function.Module._load (internal/modules/cjs/loader.js:730:27)
    at Module.require (internal/modules/cjs/loader.js:957:19)
    at require (internal/modules/cjs/helpers.js:88:18)
    at idToPlugin (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:145:14)
    at D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:184:20
    at Array.map (<anonymous>)
    at Service.resolvePlugins (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:170:10)
    at new Service (D:\nodejs\node-global\node_modules\@vue\cli-service\lib\Service.js:32:25)
    at Object.<anonymous> (D:\nodejs\node-global\node_modules\@vue\cli-service\bin\vue-cli-service.js:15:17) {
  code: 'MODULE_NOT_FOUND',
  requireStack: [
    'D:\\nodejs\\node-global\\node_modules\\@vue\\cli-service\\lib\\Service.js',
    'D:\\nodejs\\node-global\\node_modules\\@vue\\cli-service\\bin\\vue-cli-service.js'
  ]
}

D:\vue3\case1>cnpm i -g @vue/cli-plugin-babel
Downloading @vue/cli-plugin-babel to D:\nodejs\node-global\node_modules\@vue\cli-plugin-babel_tmp
Copying D:\nodejs\node-global\node_modules\@vue\cli-plugin-babel_tmp\_@vue_cli-plugin-babel@4.5.13@@vu

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值