Electron-vue: Can't alias vue for compiler included build

Created on 28 Mar 2017  路  5Comments  路  Source: SimulatedGREG/electron-vue

Vue doesn't seem to alias correctly so I can use the compiler included build.

To repro I have used an external library vuejs-datepicker which must have template: code and is throwing the following

image

I have tried a bunch of variations in the alias config field, including those mentioned here on the vue js docs.

https://vuejs.org/v2/guide/installation.html#Explanation-of-Different-Builds

image

if i alias the field with something like 'vue-alias' then import vue from 'vue-alias' I get pass the error but I am in even more pain as other libraries that use vue don't know where to look

Most helpful comment

Updated externals configuration to whitelist specific modules, in this case vue. To anybody coming to this later, here's a fix...

webpack.renderer.config.js

/* ... */
externals: Object.keys(pkg.dependencies || {}).filter(d => !['vue'].includes(d)),
/* ... */
alias: {
  'vue$': 'vue/dist/vue.esm.js',
  'components': path.join(__dirname, 'app/src/renderer/components'),
  'renderer': path.join(__dirname, 'app/src/renderer')
}
/* ... */

This fix has been applied in the dev branch. See #171 for more details.

All 5 comments

Today I also encountered the same problem
checkout this setting (webpack.renderer.config.js)
Only need to comment out this line

  externals: Object.keys(pkg.dependencies || {}),

change alieas config as

    alias: {
      'vue$': 'vue/dist/vue.esm.js',
      'components': path.join(__dirname, 'app/src/renderer/components'),
      'renderer': path.join(__dirname, 'app/src/renderer')
    }

rerun

npm run dev

@SimulatedGREG Can put this configuration in the template into options?

I've decided to default to the full Runtime + Compiler build in the next upcoming Milestone. Main reason being that the standalone runtime build was created to help lessen the final build size that would be transferred on traditional websites. But in this case, the user of an electron app will already be downloading your entire app, so adding that extra ~67kb to the build size is really trivial.

Thanks!

Updated externals configuration to whitelist specific modules, in this case vue. To anybody coming to this later, here's a fix...

webpack.renderer.config.js

/* ... */
externals: Object.keys(pkg.dependencies || {}).filter(d => !['vue'].includes(d)),
/* ... */
alias: {
  'vue$': 'vue/dist/vue.esm.js',
  'components': path.join(__dirname, 'app/src/renderer/components'),
  'renderer': path.join(__dirname, 'app/src/renderer')
}
/* ... */

This fix has been applied in the dev branch. See #171 for more details.

Was this page helpful?
0 / 5 - 0 ratings