Heroku上的Nuxt.js Webpack构建错误

时间:2017-03-09 16:30:11

标签: node.js heroku build webpack vue.js

我有一个Nuxt.js项目,我现在只添加了几个组件。如果构建本地,它运行完美。我想在Heroku上测试它,但是我得到了一些与webpack相关的构建错误,其中我已经埋了3天。

remote:        ERROR in ./~/babel-loader/lib?{"plugins":["transform-async-to-generator","transform-runtime"],"presets":[["es2015",{"modules":false}],"stage-2"],"cacheDirectory":false}!./~/vue-loader/lib/selector.js?type=script&index=0!./layouts/default.vue
remote:        Module not found: Error: Can't resolve '../components/Sidebar/_Sidebar.vue' in '/tmp/build_fe4d2e874dff634cf8c7db3886460988/layouts'
remote:        @ ./~/babel-loader/lib?{"plugins":["transform-async-to-generator","transform-runtime"],"presets":[["es2015",{"modules":false}],"stage-2"],"cacheDirectory":false}!./~/vue-loader/lib/selector.js?type=script&index=0!./layouts/default.vue 30:0-57
remote:        @ ./layouts/default.vue
remote:        @ ./~/babel-loader/lib?{"plugins":["transform-async-to-generator","transform-runtime"],"presets":[["es2015",{"modules":false}],"stage-2"],"cacheDirectory":false}!./~/vue-loader/lib/selector.js?type=script&index=0!./.nuxt/App.vue
remote:        @ ./.nuxt/App.vue
remote:        @ ./.nuxt/index.js
remote:        @ ./.nuxt/server.js

我还安装了nuxtjs.org启动主题的新副本,但没有错误。它构建像魅力。

这是我的package.json

 {
      "name": "some-nuxt",
      "version": "0.3.0",
      "description": "nuxt-sandbox ",
      "private": true,
      "dependencies": {
        "axios": "^0.15.3",
        "nuxt": "^0.9.9",
        "vue-touch": "^2.0.0-beta.4"
      },
      "scripts": {
        "dev": "nuxt",
        "build": "nuxt build",
        "start": "nuxt start",
        "generate": "nuxt generate",
        "lint": "eslint --ext .js,.vue --ignore-path .gitignore .",
        "precommit": "npm run lint",
        "heroku-postbuild": "npm run build"
      },
      "devDependencies": {
        "ava": "^0.18.2",
        "babel-eslint": "^7.1.1",
        "eslint": "^3.16.0",
        "eslint-config-standard": "^6.2.1",
        "eslint-loader": "^1.6.1",
        "eslint-plugin-html": "^2.0.1",
        "eslint-plugin-promise": "^3.4.2",
        "eslint-plugin-standard": "^2.0.1",
        "jsdom": "^9.11.0",
        "node-sass": "^4.5.0",
        "sass-lint": "^1.10.2",
        "sass-loader": "^6.0.2"
      }
    }

这是我的nuxt.config.js文件中的一些自定义。

          css: [
            // '~assets/css/main.css',
            { src: '~assets/scss/app.scss', lang: 'sass' } // scss instead of sass
          ],
          ...
          alias: {
            'hammerjs$': 'vue-touch/dist/hammer-ssr.js'
          },
          build: {
            /*
            ** Run ESLINT on save
            */
            vendor: ['axios', 'vue-touch'],
            extend (config, { isClient }) {
              if (isClient) {
                config.module.rules.push({
                  enforce: 'pre',
                  test: /\.(js|vue)$/,
                  loader: 'eslint-loader',
                  exclude: /(node_modules)/
                })
              }
            }
          },
          plugins: ['~plugins/vue-touch']
        }

2 个答案:

答案 0 :(得分:2)

我发现Heroku服务器的案例敏感文件系统Linux和我的不敏感系统发生冲突的原因。当我将我的子组件重命名为大写时,Github没有将更改推送到repo。

npm run dev和npm run build都没有在我的计算机中出现任何错误。但是,当Linux正在寻找文件夹的确切名称时,问题就出现了。

这可能是一种预防措施,处理一个干净的区分大小写的格式化分区:https://coderwall.com/p/mgi8ja/case-sensitive-git-in-mac-os-x-like-a-pro

该文件的标题解释了最好的。 http://timnew.me/blog/2013/04/18/mac-os-x-case-insensitive-file-system-pitfall/

答案 1 :(得分:0)

加起来就是Gokhan Ozdemir的回答。我遇到了类似的问题,意识到我已经仅以区分大小写的方式更改了文件夹的名称。

示例:从fontsFonts

似乎与Mac OS不区分大小写的环境有关。

我能够按照以下步骤解决它:

 git mv fonts fonts2
 git mv fonts2 Fonts
 git commit -m "changed case of dir"

请注意,我必须最初更改为fonts2,以便区分大小写的重命名有效地发生。

下面是SO answer,解释了此问题的解决方案。