vuejs / vue-component-compiler

Compile a single file Vue component into a CommonJS module.
MIT License
343 stars 52 forks source link

Using the compiled component #93

Open dannysmc95 opened 4 years ago

dannysmc95 commented 4 years ago

Hello,

Sorry to be asking this, as I appreciate that this may be a stupid question, but I am just unsure.

So I have followed the instructions and successfully compiled and output a .vue component with the output of the assembly function. I am just confused as to what I can do with it after that?

My company requires that we vet all parts of a compilation process (due to security) so we are trying to do it without using other peoples packages.

So I was wondering exactly what am I missing to get this working? Do I need to do something else, like transpile it? as I can see the current exported component once it's been ran through this library is not usable on the browser.

So in short, what do I need to do to the output of the component to get it so I can load it into Vue as a component?

I have the following:

const VueComponentCompiler = require('@vue/component-compiler');
const fs = require('fs');
const path = require('path');

const VueCompiler = VueComponentCompiler.createDefaultCompiler();
const vComponent = VueCompiler.compileToDescriptor('component.vue', fs.readFileSync(path.resolve('component.vue'), 'utf8'));
const assembledComponent = VueComponentCompiler.assemble(vComponent, 'component.vue', vComponent);
fs.writeFileSync('component.vue.js', assembledComponent.code);

Thank you any hints or nudges in the right direction would be extremely appreciated!

Thanks, Danny

ccleve commented 4 years ago

@dannysmc95 Did you find an answer? Also, this looks like Node/server-side code. Any clue how to do this in a browser?

dannysmc95 commented 4 years ago

@ccleve I never saw this, but no, I never did and it's all the same with SSR, there are many useful things that are just not available or at least; not documented.

For example, I wanted to work on a plugin for a framework I am developing to support SSR and there is just no simple way to work with Vue SPA and SFC's without webpack and the thousand dependencies it comes with, and even the super simple demos that the SSR website demo offers simply doesn't work with TypeScript.

Even the SSR demo is convoluted, I spent days trying to work with it, but it's just overly complex and in the end I gave up with it, because I did not wish to use webpack. As stated in the above, I want to be able to manage each step of the process.

What I want is the ability to separate the SFC into the various parts and then manage them outside of webpack, and then support building them and using them for SSR as well. It seems when asking questions in the forum, and here, it's mostly unanswered. I am not sure. Maybe there needs to be more members on the forums with more knowledge or at least be willing to point them in the right direction?