search

universal-vue / uvue

Vue CLI plugin to create universal Vue applications with ease
https://universal-vue.github.io/docs/
MIT License
127 stars 13 forks source link

Typescript support for server plugins #44

Open jaredmcateer opened 4 years ago

jaredmcateer commented 4 years ago

I am not really sure if this is a bug or a feature request. I suspect feature request and the second part of this ticket is some weird side effect.

I am following the patterns laid out in the https://github.com/universal-vue/examples repository but trying to write it in TS. I'm able to write almost all aspects of my app in src/ as Typescript except src/server plugins.

When I try to include a typescript file in the server.config.js and serve the app I get the following error

 ERROR  Error: Cannot find module '/opt/mp/src/server/apiPlugin'
Require stack:
- /opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/uvue/index.js
- /opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/index.js
- /opt/mp/node_modules/@vue/cli-service/lib/Service.js
- /opt/mp/node_modules/@vue/cli-service/bin/vue-cli-service.js
/opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/uvue/index.js:1
Error: Cannot find module '/opt/mp/src/server/apiPlugin'
Require stack:
- /opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/uvue/index.js
- /opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/index.js
- /opt/mp/node_modules/@vue/cli-service/lib/Service.js
- /opt/mp/node_modules/@vue/cli-service/bin/vue-cli-service.js
    at module.exports.installServerPlugins (/opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/uvue/index.js:155:17)
    at startServer (/opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/commands/serveRun.js:85:12)
    at /opt/mp/node_modules/@uvue/vue-cli-plugin-ssr/commands/serveRun.js:29:13
    at processTicksAndRejections (internal/process/task_queues.js:85:5)

However, if I append the file extension to server.config.js

// server.config.js
import { ExpressAdapter } from "@uvue/server";

export default {
  adapter: ExpressAdapter,
  plugins: [
    "@uvue/server/plugins/gzip",
    "@uvue/server/plugins/serverError",
    "@uvue/server/plugins/static",
    "@uvue/server/plugins/modernBuild",

    "./src/server/apiPlugin.ts", // <-- suffix added so it can detected
  ],
};

It is able to detect the file but now it cannot find any imported files and I have to append the suffix to those as well

// src/server/apiPlugin.ts
import api from "./api.ts"; // <--- suffix added so it can detected

export default {
  install(server) {
    api(server);
  },
};

The plugin gets installed and appears to work, However the Typescript compiler is not very happy about the inclusion of the .ts extension in the import.

An import path cannot end with a '.ts' extension. Consider importing './api' instead.ts(2691)

yabab-dev commented 4 years ago

You are right, actually, server side doesn't support TypeScript because no transpilation is done before server start.

I've some plans to make this work, but for now, you have to handle this manually.