Comments (23)
I've managed to come up with a solution. This whole Vue CLI + webpack configuration topic could be even better documented than it already is... The thing with the changes in a4ee8e4 is, that the plugin is adopting the "new" chainWebpack
API there, which actually makes things a lot easier and at least opens up many possibilities to plugin developers in general.
What's bad is that by default the chainWebpack
hooks from @vue/cli-plugin-typescript
run later than the ones from this plugin, given that they are both listed in the same group of dependencies in package.json
, while dependencies
run after devDependencies
. One can change the alphabetical order by hand, which I did and my issue was immediately gone. Under circumstances the Vue's typescript plugin overrides the critical option entry.app
with its default value ./src/main.ts
.
–> responsible lines of code here.
from vue-cli-plugin-ssr.
Plugin ordering is on our radar for v4
from vue-cli-plugin-ssr.
I've managed to come up with a solution. This whole Vue CLI + webpack configuration topic could be even better documented than it already is... The thing with the changes in a4ee8e4 is, that the plugin is adopting the "new"
chainWebpack
API there, which actually makes things a lot easier and at least opens up many possibilities to plugin developers in general.What's bad is that by default the
chainWebpack
hooks from@vue/cli-plugin-typescript
run later than the ones from this plugin, given that they are both listed in the same group of dependencies inpackage.json
, whiledependencies
run afterdevDependencies
. One can change the alphabetical order by hand, which I did and my issue was immediately gone. Under circumstances the Vue's typescript plugin overrides the critical optionentry.app
with its default value./src/main.ts
.
For anyone having trouble to understand the "change the alphabetical order" (like me), thinking that is something "complex" and isn't understanding it correctly... All you have to do is to change the order in the package.json (putting "@akryum/vue-cli-plugin-ssr" after "@vue/cli-plugin-typescript"), and it works as expected.
Thank you so much @nether-cat !!! 👍
from vue-cli-plugin-ssr.
@houd1ni awesome, it's works ))
from vue-cli-plugin-ssr.
amazing detective work @nether-cat. Can confirm that this solution worked for me too!
Seems like there should be a way for vue-cli to let you specify the order of plugins when the order matters
from vue-cli-plugin-ssr.
Instead of moving the @akryum/vue-cli-plugin-ssr
plugin after @vue/cli-plugin-typescript
in package.json you can add this config to vue.config.js
module.exports = {
chainWebpack: (config) => {
const chainWebpack = require('@akryum/vue-cli-plugin-ssr/lib/webpack').chainWebpack
chainWebpack(config)
}
}
But it's likely to run twice.
Another solution is to add the plugin to the argument --skip-plugins
and add it as a local plugin
#package.json
{
...
"scripts": {
...
"ssr:build": "vue-cli-service ssr:build --skip-plugins=@akryum/vue-cli-plugin-ssr",
"ssr:serve": "vue-cli-service ssr:serve --skip-plugins=@akryum/vue-cli-plugin-ssr",
"ssr:start": "cross-env NODE_ENV=production vue-cli-service ssr:serve --mode production --skip-plugins=@akryum/vue-cli-plugin-ssr"
}
...
"vuePlugins": {
"service": [
"node_modules/@akryum/vue-cli-plugin-ssr/index.js"
]
}
}
from vue-cli-plugin-ssr.
Is there a good long term fix for this in latest Vue CLI or something? I'm having this problem and none of the solutions seem super ideal.
from vue-cli-plugin-ssr.
I can also confirm 0.3.0 works fine but 0.5.0 causes errors.
from vue-cli-plugin-ssr.
@sneko @mayase did: a4ee8e4#commitcomment-32247700
from vue-cli-plugin-ssr.
Can you provide a demo repo or a sandbox with your code in it so that I can get a closer look at the issue you have? I already have an SSR app with this plugin and TS and it works like charm.
Thanks
from vue-cli-plugin-ssr.
@p1n5u please, check, is your version exactly 0.5.0 or older indeed? I've met the same weird stuff, and all's charm without TS after upgrade.
from vue-cli-plugin-ssr.
@houd1ni It was running on 0.3.0
but I've just updated to the latest version (0.5.0
) and it stopped working indeed 😭 I will compare the two versions as soon as I have time and propose a solution 😄
from vue-cli-plugin-ssr.
I have a similar situation - plugin is broken after 0.4.0
😭
from vue-cli-plugin-ssr.
Thanks for the help narrowing down the issue. I'll try to use an older version in the mean time.
from vue-cli-plugin-ssr.
In my case I see the following:
✔ success Client compiled in 987ms
Type checking in progress...
Client errors
multi webpack-hot-middleware/client ./src/main.ts
Module not found: Error: Can't resolve './src/main.ts' in '/Users/yekver/app'
this is because my entry point is main.js
not main.ts
. Trying to fix this issue I change this file extension to ts
but then got Internal server error page error with message: Error: bundle export should be a function when using { runInNewContext: false }.
from vue-cli-plugin-ssr.
I have same problem and downgrade don't fix it
from vue-cli-plugin-ssr.
@ilajosmanov Should be ok if clearly downgrade to 0.3.0
from vue-cli-plugin-ssr.
@houd1ni I tried installing it with vue add @akryum/[email protected]
, but it says "Plugin @akryum/[email protected] does not have a generator to invoke". So no files were added or updated. What did i do wrong? Please
from vue-cli-plugin-ssr.
@alexey-yunoshev Looks like off-topic, but I afraid, you just mistyped "vue add @akryum/[email protected]".
from vue-cli-plugin-ssr.
@houd1ni I tried it with vue add @akryum/[email protected]
. Same thing - "does not have a generator to invoke"
Update: To make it work I had to do this:
vue add @akryum/[email protected]
vue invoke @akryum/vue-cli-plugin-ssr
Also, when starting a server with npm run ssr:serve
and opening the site in a browser I got this error:
export function register (swUrl, hooks) {
^^^^^^
In order to fix this I changed import "./registerServiceWorker';" to "if (process.client) require("./registerServiceWorker");" in main.ts. Got the idea from here
from vue-cli-plugin-ssr.
Did someone find the difference responsible of this?
I will give a try to downgrading 🤔
from vue-cli-plugin-ssr.
@houd1ni Does v0.3.0 has a hook to add or update files such as entry-client, entry-server and so on? I added v0.3.0 but there were no files added or updated.
from vue-cli-plugin-ssr.
Also interested by a proper fix to benefit from latest versions features 😄
from vue-cli-plugin-ssr.
Related Issues (20)
- Webpack docs: what does `api` refer to? HOT 1
- Server redirect implementation HOT 7
- how to use the dist folder?
- Error returned after installing vue-extend-layout extension
- app.js script chunk rendered twice HOT 5
- SyntaxError: Unexpected token export register-service-worker HOT 4
- multiple run mounted() HOT 3
- https protocol support HOT 1
- ESLint reccomended `no-async-promise-executor` broken in example HOT 1
- extendServer devServer watch
- Vuex strict mode always leads to "do not mutate vuex store state outside mutation handlers" HOT 2
- "document is not defined" when criticalCSS is disabled in production
- Vuex store is not loaded to client side app HOT 2
- How to exclude client side only packages? HOT 1
- Fatal issue with deps ordering in package.json HOT 1
- Scripts loaded twice HOT 1
- Any way to inspect generated webpack config? HOT 1
- Requests fail with cookie array in response HOT 2
- Initializer provides no value for this binding element and the binding element has no default value
- Error on run vue add @akryum/vue-cli-plugin-ssr
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vue-cli-plugin-ssr.