Skip to content

wrong css order when in build src #4866

Closed
@newbie78

Description

@newbie78

Version

4.0.5

Environment info

Environment Info:

  System:
    OS: Linux 4.19 Alpine Linux undefined
    CPU: (2) x64 Intel(R) Core(TM) i5-4210U CPU @ 1.70GHz
  Binaries:
    Node: 10.17.0 - /usr/local/bin/node
    Yarn: 1.19.1 - /usr/local/bin/yarn
    npm: 6.11.3 - /usr/local/bin/npm
  Browsers:
    Chrome: Not Found
    Firefox: Not Found
  npmPackages:
    @vue/babel-helper-vue-jsx-merge-props:  1.0.0 
    @vue/babel-plugin-transform-vue-jsx:  1.1.2 
    @vue/babel-preset-app:  4.0.5 
    @vue/babel-preset-jsx:  1.1.2 
    @vue/babel-sugar-functional-vue:  1.1.2 
    @vue/babel-sugar-inject-h:  1.1.2 
    @vue/babel-sugar-v-model:  1.1.2 
    @vue/babel-sugar-v-on:  1.1.2 
    @vue/cli-overlay:  4.0.5 
    @vue/cli-plugin-babel: ^4.0.0 => 4.0.5 
    @vue/cli-plugin-eslint: ^4.0.0 => 4.0.5 
    @vue/cli-plugin-router: ^4.0.5 => 4.0.5 
    @vue/cli-plugin-vuex:  4.0.5 
    @vue/cli-service: ^4.0.0 => 4.0.5 
    @vue/cli-shared-utils:  4.0.5 
    @vue/component-compiler-utils:  3.0.2 
    @vue/eslint-config-airbnb: ^4.0.0 => 4.0.1 
    @vue/preload-webpack-plugin:  1.1.1 
    @vue/web-component-wrapper:  1.2.0 
    eslint-plugin-vue: ^5.0.0 => 5.2.3 
    vue: ^2.6.10 => 2.6.10 
    vue-cli-plugin-vuetify: ^2.0.2 => 2.0.2 
    vue-eslint-parser:  5.0.0 
    vue-hot-reload-api:  2.3.4 
    vue-loader:  15.7.2 
    vue-router: ^3.1.3 => 3.1.3 
    vue-style-loader:  4.1.2 
    vue-svg-inline-loader: ^1.4.3 => 1.4.3 
    vue-template-compiler: ^2.6.10 => 2.6.10 
    vue-template-es2015-compiler:  1.9.1 
    vuetify: ^2.1.0 => 2.1.10 
    vuetify-loader: ^1.3.0 => 1.3.1 
  npmGlobalPackages:
    @vue/cli: Not Found

Steps to reproduce

noticed this point in the middle of the project development process

What is expected?

order css in tag

some-vendor-chunks.css
import-custom.css
components-style.css

What is actually happening?

really order css in tag

components-style-with-other-vendors.css
part-ofvendor.css
last-vandor-chunk.css
import-custom.css
last-vandor-chunk.css
import-custom.css

...
    href=/static/css/chunk-29585fdf.58dd60f2.css rel=prefetch>
  <link href=/static/css/chunk-feeccf32.b13ec5a3.css rel=prefetch>
  <link href=/static/js/chunk-29585fdf.4c62f156.js rel=prefetch>
  <link href=/static/js/chunk-94c892b4.d9acbb26.js rel=prefetch>
  <link href=/static/js/chunk-ea95a8b8.fe43bdd4.js rel=prefetch>
  <link href=/static/js/chunk-feeccf32.c42ee7c2.js rel=prefetch>
  <link href=/static/css/chunk-vendors.9ce8c3df.css rel=preload as=style>
  <link href=/static/css/custom.2ad153a1.css rel=preload as=style>
  <link href=/static/js/chunk-vendors.d889112f.js rel=preload as=script>
  <link href=/static/js/custom.81fa275a.js rel=preload as=script>
  <link href=/static/css/chunk-vendors.9ce8c3df.css rel=stylesheet>
  <link href=/static/css/custom.2ad153a1.css rel=stylesheet>

i see this in head.
why it's so shuffle?

in development mode i see next picture:
import-custom
vendor
components-style

Metadata

Metadata

Assignees

No one assigned

    Labels

    needs reproductionThis issue is missing a minimal runnable reproduction, provided by the author

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions