TL / DR;

Question

问题的标题说明了一切。

我使用的是Vue CLI，项目第一次编译就很好。但是，如果我尝试再次构建它，它将失败并显示以下错误：

Error: Child compilation failed:
  Entry module not found: Error: Can't resolve 'C:\Users\Oliver\Workspace\academy-residences\public\index.html' in 'C:\Users\Oliver\Workspace\academy-residences':
  Error: Can't resolve 'C:\Users\Oliver\Workspace\academy-residences\public\index.html' in 'C:\Users\Oliver\Workspace\academy-residences'

  - compiler.js:79 childCompiler.runAsChild
    [academy-residences]/[html-webpack-plugin]/lib/compiler.js:79:16

  - Compiler.js:300 compile
    [academy-residences]/[webpack]/lib/Compiler.js:300:11

  - Compiler.js:556 hooks.afterCompile.callAsync.err
    [academy-residences]/[webpack]/lib/Compiler.js:556:14


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [academy-residences]/[tapable]/lib/Hook.js:154:20

  - Compiler.js:553 compilation.seal.err
    [academy-residences]/[webpack]/lib/Compiler.js:553:30


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [academy-residences]/[tapable]/lib/Hook.js:154:20

  - Compilation.js:1323 hooks.optimizeAssets.callAsync.err
    [academy-residences]/[webpack]/lib/Compilation.js:1323:35


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [academy-residences]/[tapable]/lib/Hook.js:154:20

  - Compilation.js:1314 hooks.optimizeChunkAssets.callAsync.err
    [academy-residences]/[webpack]/lib/Compilation.js:1314:32


  - Hook.js:154 AsyncSeriesHook.lazyCompileHook
    [academy-residences]/[tapable]/lib/Hook.js:154:20

  - Compilation.js:1309 hooks.additionalAssets.callAsync.err
    [academy-residences]/[webpack]/lib/Compilation.js:1309:36



[copy-webpack-plugin] unable to locate 'C:\Users\Oliver\Workspace\academy-residences\public' at 'C:\Users\Oliver\Workspace\academy-residences\public'
 ERROR  Build failed with errors.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! academy-residences@0.1.0 watch: `vue-cli-service build --watch`
npm ERR! Exit status 1
npm ERR!

但是，如果我删除.cache中的node_modules文件夹，那么它将再次正确构建！

我的package.json看起来像这样：

{
  "name": "academy-residences",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "serve": "vue-cli-service serve",
    "build": "vue-cli-service build",
    "watch": "vue-cli-service build --watch",
    "test:unit": "vue-cli-service test:unit",
    "heroku-postbuild": "vue-cli-service build"
  },
  "dependencies": {
    "axios": "^0.18.0",
    "element-ui": "^2.4.5",
    "moment": "^2.24.0",
    "vue": "^2.5.21",
    "vue-router": "^3.0.1",
    "vuex": "^3.0.1"
  },
  "devDependencies": {
    "@vue/cli-plugin-babel": "^3.3.0",
    "@vue/cli-plugin-unit-jest": "^3.3.0",
    "@vue/cli-service": "^3.3.0",
    "@vue/test-utils": "^1.0.0-beta.20",
    "babel-core": "7.0.0-bridge.0",
    "babel-jest": "^23.6.0",
    "node-sass": "^4.9.2",
    "sass-loader": "^7.0.3",
    "vue-cli-plugin-element": "^1.0.1",
    "vue-template-compiler": "^2.5.21"
  }
}

这是我的vue.config

module.exports = {
    outputDir: './public',

    publicPath: process.env.NODE_ENV === 'production' ? '' : '',

    configureWebpack: {
        resolve: {
            alias: {
                '@': __dirname + '/ui/src'
            }
        },
        entry: {
            app: './ui/src/main.js'
        }
    }
};

package.json位于项目的根文件夹中，所有vue源代码都位于ui中

root/
  ui/
    src/
  node_modules/
  package.json

这是最近出现的问题。前几天，一切正常。我认为可能造成此问题的唯一原因是删除@ vue / cli并重新安装。

Answer 1

这是最近出现的问题。前几天，一切正常。我认为可能导致此问题的唯一原因是删除 @ vue / cli并重新安装。

好吧，你是对的。直到2018年中，我以前的文件夹结构都像

project
 ├── config
 ├── src // components, router, etc
 ├── static // images, robots.txt manifest, vendor css and whatnot
 ├── dist // not under version control, generated at deploy time
 └── index.html // entry point

在构建项目时，将dist文件夹擦除干净，然后将src中的块编译到其中，然后将static下的静态文件复制到{{1 }}（这可能会在编译src文件之前发生，无论如何）。

我的配置如下：

dist

new CopyWebpackPlugin([ { from: path.resolve(__dirname, '../static'), to: config.build.assetsSubDirectory, ignore: ['.*'] } ]),是config.build.assetsSubDirectory的地方。

快速前进到当前的@ vue / cli（截至2019年3月），该模板现在使用webpack @ 4而不是webpack @ 3，并且一些默认设置已更改。具体来说，他们希望结构为：

dist

因此在您的配置中，声明

project
 ├── config
 ├── src 
 ├── public //  <── WHAIT!!! NO LONGER CALLED "static"
 |   └── index.html // <── NO LONGER IN ROOT
 └── dist

意味着您在构建时擦除了module.exports = { outputDir: './public', ... }，然后webpack无法将您的公共资产从其默认资产源复制到输出文件夹中，该文件夹变得相同。

现在，如果您检查webpack实际在做什么（从项目的根文件夹）

public

或

vuw inspect > output.js

您将看到$(npm bin)/vue-cli-service > output.js有一个类似于以下内容的块：

output.js

如果我将/* config.plugin('copy') */ new CopyWebpackPlugin( [ { from: '/home/user/project/public', to: '/home/user/project/dist', toType: 'dir', ignore: [ '.DS_Store' ] } ] ),更改为您拥有的

vue.config.js

后一个命令将输出一段内容：

outputDir: "./public",

这显然毫无意义

TL / DR;

请勿将/* config.plugin('copy') */ new CopyWebpackPlugin( [ { from: '/home/user/project/public', to: '/home/user/project/public', toType: 'dir', ignore: [ '.DS_Store' ] } ] ),用作输出文件夹，也不要找到更改静态资产文件夹的方法，我相信您必须在vue配置文件中手动配置public。

除非我清除.cache文件夹，否则第一次构建后Vue CLI子编译失败

1 个答案:

TL / DR;