使用 webpack 初始化一个 vue.js 3 项目

Question

曾经可以使用“vue init webpack client”用 webpack 初始化一个 vue.js 2 项目。在vue.js 3项目中，据我了解，需要使用“vue create”来创建一个新项目。但是，这不会使用 webpack 初始化项目。我没有找到任何替换 vue.js 2 中使用的命令的示例，该命令可用于初始化 vue.js 3 项目，但只能手动步骤。

Answer 1

vue create 搭建了一个在后台使用 Webpack 的 Vue 项目。 Webpack 是 @vue/cli-service 的构建依赖。您会在运行 npm list webpack 从脚手架项目的根目录中看到它列出：

$ npm list webpack
vue3-proj@0.1.0 /Users/tony/src/tmp/vue3-proj
├─┬ @vue/cli-plugin-babel@4.5.12
│ ├─┬ babel-loader@8.2.2
│ │ └── webpack@4.46.0 deduped
│ ├─┬ cache-loader@4.1.0
│ │ └── webpack@4.46.0 deduped
│ ├─┬ thread-loader@2.1.3
│ │ └── webpack@4.46.0 deduped
│ └─┬ webpack@4.46.0
│   └─┬ terser-webpack-plugin@1.4.5
│     └── webpack@4.46.0 deduped
├─┬ @vue/cli-plugin-eslint@4.5.12
│ ├─┬ eslint-loader@2.2.1
│ │ └── webpack@4.46.0 deduped
│ └── webpack@4.46.0 deduped
└─┬ @vue/cli-service@4.5.12
  ├─┬ @intervolga/optimize-cssnano-plugin@1.0.6
  │ └── webpack@4.46.0 deduped
  ├─┬ @soda/friendly-errors-webpack-plugin@1.8.0
  │ └── webpack@4.46.0 deduped
  ├─┬ @vue/preload-webpack-plugin@1.1.2
  │ └── webpack@4.46.0 deduped
  ├─┬ copy-webpack-plugin@5.1.2
  │ └── webpack@4.46.0 deduped
  ├─┬ css-loader@3.6.0
  │ └── webpack@4.46.0 deduped
  ├─┬ file-loader@4.3.0
  │ └── webpack@4.46.0 deduped
  ├─┬ html-webpack-plugin@3.2.0
  │ └── webpack@4.46.0 deduped
  ├─┬ mini-css-extract-plugin@0.9.0
  │ └── webpack@4.46.0 deduped
  ├─┬ terser-webpack-plugin@2.3.8
  │ └── webpack@4.46.0 deduped
  ├─┬ url-loader@2.3.0
  │ └── webpack@4.46.0 deduped
  ├─┬ vue-loader@15.9.6
  │ └── webpack@4.46.0 deduped
  ├─┬ webpack-dev-server@3.11.2
  │ ├─┬ webpack-dev-middleware@3.7.3
  │ │ └── webpack@4.46.0 deduped
  │ └── webpack@4.46.0 deduped
  └── webpack@4.46.0 deduped

使用 webpack 初始化一个 vue.js 3 项目

Initialise a vue.js 3 project with webpack

javascript

nodes

webpack

vue.js