Error: Cannot find module

[collymore]

I'm trying to use a Vue component from the node_modules folder. It works correctly when running as vuepress dev but not when vuepress build

Installed with Yarn by running
yarn add vue-carousel-3d

and imported within
.vuepress/enhanceApp.js

import { Carousel3d } from 'vue-carousel-3d';

export default ({
    Vue, // the version of Vue being used in the VuePress app
    options, // the options for the root Vue instance
    router, // the router instance for the app
    siteData // site metadata
  }) => {
    Vue.component('carousel3d', Carousel3d);
}

Runing Vuepress build returns

Rendering static HTML...
Rendering page: /Error rendering /:
Error: Cannot find module 'vue-carousel-3d'
    at Function.Module._resolveFilename (module.js:536:15)
    at Function.Module._load (module.js:466:25)
    at Module.require (module.js:579:17)
    at require (internal/module.js:11:18)
    at r (/Users/lukecollymore/.config/yarn/global/node_modules/vue-server-renderer/build.js:8335:16)
    at Object.module.exports.__WEBPACK_AMD_DEFINE_FACTORY__ (webpack:/external "vue-carousel-3d":1:0)
    at __webpack_require__ (webpack/bootstrap:25:0)
    at Object.<anonymous> (server-bundle.js:3315:33)
    at __webpack_require__ (webpack/bootstrap:25:0)
    at Object.<anonymous> (server-bundle.js:3634:18)
    at __webpack_require__ (webpack/bootstrap:25:0)
    at server-bundle.js:103:18
    at Object.<anonymous> (server-bundle.js:106:10)
    at evaluateModule (/Users/lukecollymore/.config/yarn/global/node_modules/vue-server-renderer/build.js:8338:21)
    at /Users/lukecollymore/.config/yarn/global/node_modules/vue-server-renderer/build.js:8396:18
    at new Promise (<anonymous>)

What else do I need to do for this to build?

• OSX 10.13.2
• Node.js v8.9.1
• Yarn 1.6.0
• VuePress 0.8.4

[ulivz]

Do you install VuePress globally? and, is there any reproduced repo?

[collymore]

Yes Vuepress is installed Globally. I will setup a repo today. Thanks

[meteorlxy]

@collymore Suggest to install vuepress locally at current version. Global cli still have some issues

[meteorlxy]

btw, as a temporary solution, #353 may help

[collymore]

I've added vuepress as a local dependancy and installed, it has now found the module but it's throwing another error which I believe is related.

Running build withe the following command,

node ./node_modules/vuepress/bin/vuepress.js build

returns

Rendering page: /Error rendering /:
/Users/lukecollymore/Documents/workspace/vue/vuepress/magedevstudy/node_modules/vue-confirmation-button/dist/vue-confirmation-b
utton.vue:3
<template>
^

SyntaxError: Unexpected token <
    at createScript (vm.js:80:10)
    at Object.runInThisContext (vm.js:139:10)

It still runs correctly with vuepress dev

I've setup a repo with the code here
https://github.com/collymore/Magento-2-CPD-Exam-Study-Docs

Thanks

[ulivz]

@collymore Excuse me, I just downloaded your repo and cannot reproduce it:

[collymore]

Thanks for taking a look, I've just setup another Mac and an Ubuntu computer and both error at that same point.

Mac OSX
yarn -v 1.6.0
node -v v8.3.0

Ubuntu 14.04.5 LTS
node -v v8.11.1
Yarn - 1.6.0

Can you let me know what versions you were using?

It looks like the .vue file hasn't been compiled first

[ulivz]

Oh, it's truly an issue, I reproduced it.

For now, you can use relative path to get a quick fix:

Change:

import vueConfirmationButton from 'vue-confirmation-button/dist/vue-confirmation-button.vue';

To:

import vueConfirmationButton from '../../node_modules/vue-confirmation-button/dist/vue-confirmation-button.vue';

But it works at dev, and only doesn't work at build. i need do more investigation.

[ulivz]

Closing this since the 1st issue cannot be reproduced, for the 2nd issue, let's go #451.