Skip to content

RC 3 update breaks working Webpack production build #1617

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
podlebar opened this issue Jun 19, 2018 · 11 comments
Closed

RC 3 update breaks working Webpack production build #1617

podlebar opened this issue Jun 19, 2018 · 11 comments
Labels
cannot reproduce We cannot reproduce the problem with the given information. More env information needed.

Comments

@podlebar
Copy link

podlebar commented Jun 19, 2018

Version

3.0.0-rc.3

Reproduction link

https://gist.github.com/podlebar/c10cd6e14545ad6f29780b258122a33c

Steps to reproduce

Update all deps to RC 3, run 'npm run build' or 'yarn build'.

packacke dev deps should be like:

"devDependencies": {
    "@vue/cli-plugin-eslint": "^3.0.0-rc.3",
    "@vue/cli-plugin-pwa": "^3.0.0-rc.3",
    "@vue/cli-service": "^3.0.0-rc.3",
    "@vue/eslint-config-prettier": "^3.0.0-rc.3",
    "node-sass": "^4.9.0",
    "sass-loader": "^7.0.1",
    "vue-template-compiler": "^2.5.16"
  },

vue.config.js

module.exports = {
  pwa: {
    name: 'xxx',
    themeColor: '#3c3c4c',
    appleMobileWebAppCapable: 'yes',
    appleMobileWebAppStatusBarStyle: 'black',
    swDest: 'dist/sw.js',
    workboxPluginMode: 'InjectManifest',
    workboxOptions: {
      swSrc: 'dev/sw.js'
    }
  },

  baseUrl: '',
  outputDir: 'dist',
  assetsDir: 'assets',
  runtimeCompiler: false,
  productionSourceMap: false,
  parallel: true,

  css: {
    extract: true,
    sourceMap: true,
    modules: true
  },

  lintOnSave: true
}

What is expected?

output should be somehow like:

  dist/js/chunk-vendors.81a28aea.js         274.86 kb        71.06 kb
  dist/js/app.314cd380.js                   8.86 kb          3.42 kb
  dist/precache-manifest.2419737b5bfdcdd    0.46 kb          0.22 kb
  5de20cb9b91a848a3.js
  dist/sw.js                                0.15 kb          0.14 kb
  dist/css/chunk-vendors.271358e2.css       14.13 kb         2.72 kb
  dist/css/app.2973a23a.css

also no service worker is created nor the manifest file.

What is actually happening?

output is:

dist/app.js    1302.84 kb                    206.43 kb

It seems that the RS 3 update changes how Webpack build the production build.
I tried different settings and none of them worked. Also tried re-configure via VUE UI but no affect on production build.

Inspection Webpack output from VUE UI: https://gist.github.com/podlebar/c10cd6e14545ad6f29780b258122a33c

'npm run serve' also throws a error:
Uncaught Error: [HMR] Hot Module Replacement is disabled.

@LinusBorg
Copy link
Member

LinusBorg commented Jun 19, 2018

Please provide a repository with a runable reproduction.

You might also want to explain from which version you updated when this problem appeared.

@LinusBorg LinusBorg added the needs reproduction This issue is missing a minimal runnable reproduction, provided by the author label Jun 19, 2018
@podlebar
Copy link
Author

@LinusBorg
https://github.com/podlebar/vue-cli-rc3-issue

updated from 3.0.0-beta.15

@LinusBorg LinusBorg added cannot reproduce We cannot reproduce the problem with the given information. More env information needed. and removed needs reproduction This issue is missing a minimal runnable reproduction, provided by the author labels Jun 20, 2018
@LinusBorg
Copy link
Member

Can't reproduce the problem, everthing's where it should be when I run build.

image

Have you tried deleting /node_modules and re-installing all dependencies?

@podlebar
Copy link
Author

yes.. first thing i tried.. i realized now that if a create a new project via cli the same things happen.
Uninstalling vue-cli and reinstall did not help.. any other global module i should try to remove?

i tried 'npm uninstall -g @vue/cli' but maybe there is more to to for a 'reset'.

@LinusBorg
Copy link
Member

i tried 'npm uninstall -g ' but maybe there is more to to for a 'reset'.

No, npm uninstall -g @vue/cli && npm i -g @vue-cli should suffice

@podlebar
Copy link
Author

very strange.. reinstalled everything and still i get the same..
also i noticed that on 'npm run build' i get 'Images and other types of assets omitted.'. So for some reason the CSS not touched at all but the webpack config clearly contains a rule for css: https://gist.github.com/podlebar/c10cd6e14545ad6f29780b258122a33c

@podlebar
Copy link
Author

should there not be something like ExtractTextPlugin to get the css?

@LinusBorg
Copy link
Member

LinusBorg commented Jun 20, 2018

Hm, it seems that it's running the build command with NODE_ENV=development as environment variables.

that would explain why there's still vue-style-loader in there instad of the extract plugin etc.

Please run printenv in your terminal (assuming your are on OSX/linux) and check if you have NODE_ENV set as a permanent environment variable...

@podlebar
Copy link
Author

yes i have NODE_ENV=local .. but this is since quiet some time like this..
i removed it and reloaded my .zshrc .. no affect.. but it worked after restarting iterm2..

was that handled differently in the previous releases?

@LinusBorg thx a lot for the help.. you can kindly close the issue

@LinusBorg
Copy link
Member

was that handled differently in the previous releases?

In a way, yes. in beta.16 we made sure that variables in .env vars don't overwrite variables set externally - this change allows you to overwrite environment variables by defining them in your CI environment, without the need for a separate .env file for it.

See here: https://github.com/vuejs/vue-cli/blob/dev/CHANGELOG.md#300-beta16-2018-06-08

env: preserve existing env vars so load in reverse order. (#1503) (7c1ef24)

@ghost
Copy link

ghost commented Jun 29, 2018

Same problem running "npm run serve" on Windows 10 using 3.0.0-rc.3. "npm run build" works fine.
Solved this by running "set NODE_ENV=" before running "npm run serve"

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
cannot reproduce We cannot reproduce the problem with the given information. More env information needed.
Projects
None yet
Development

No branches or pull requests

3 participants