As part of transition to Vue 3.0 and Vite (#230), this commit facilitates the shift towards building rest of the application using Vite. By doing so, it eliminates reliance on outdated Electron building system that offered limited control, blocking desktop builds (#233). Changes include: - Introduce Vite with Vue 2.0 plugin for test execution. - Remove `mocha`, `chai` and other related dependencies. - Adjust test to Vitest syntax. - Revise and update `tests.md` to document the changes. - Add `@modyfi/vite-plugin-yaml` plugin to be able to use yaml file depended logic on test files, replacing previous webpack behavior. - Fix failing tests that are revealed by Vitest due to unhandled errors and lack of assertments. - Remove the test that depends on Vue CLI populating `process.env`. - Use `jsdom` for unit test environment, adding it to dependency to `package.json` as project now depends on it and it was not specified even though `package-lock.json` included it.
111 lines
3.9 KiB
JavaScript
111 lines
3.9 KiB
JavaScript
const { resolve } = require('path');
|
|
const { defineConfig } = require('@vue/cli-service');
|
|
const packageJson = require('./package.json');
|
|
const tsconfigJson = require('./tsconfig.json');
|
|
|
|
loadVueAppRuntimeVariables();
|
|
fixTestBuildWithModules();
|
|
|
|
module.exports = defineConfig({
|
|
transpileDependencies: true,
|
|
chainWebpack: (config) => {
|
|
changeAppEntryPoint('./src/presentation/main.ts', config);
|
|
addWebpackRule('yaml', /\.ya?ml$/, 'js-yaml-loader', config);
|
|
},
|
|
configureWebpack: {
|
|
resolve: {
|
|
alias: {
|
|
...getAliasesFromTsConfig(),
|
|
},
|
|
fallback: {
|
|
/* Tell webpack to ignore polyfilling them because Node core modules are never used
|
|
for browser code but only for desktop where Electron supports them. */
|
|
...ignorePolyfills('os', 'child_process', 'fs', 'path'),
|
|
},
|
|
},
|
|
// Fix compilation failing on macOS when running unit/integration tests
|
|
externals: ['fsevents'],
|
|
// Use something other than default source mapper or babel cannot
|
|
// log stacks like `console.log(new Error().stack)`
|
|
devtool: 'eval-source-map',
|
|
},
|
|
pluginOptions: {
|
|
// https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/guide.html#native-modules
|
|
electronBuilder: {
|
|
mainProcessFile: './src/presentation/electron/main.ts', // https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/configuration.html#webpack-configuration
|
|
nodeIntegration: true, // required to reach Node.js APIs for environment specific logic
|
|
// https://www.electron.build/configuration/configuration
|
|
builderOptions: {
|
|
publish: [{
|
|
// https://www.electron.build/configuration/publish#githuboptions
|
|
// https://nklayman.github.io/vue-cli-plugin-electron-builder/guide/recipes.html#enable-publishing-to-github
|
|
provider: 'github',
|
|
vPrefixedTagName: false, // default: true
|
|
releaseType: 'release', // or "draft" (default), "prerelease"
|
|
}],
|
|
mac: { // https://www.electron.build/configuration/mac
|
|
target: 'dmg',
|
|
},
|
|
win: { // https://www.electron.build/configuration/win
|
|
target: 'nsis',
|
|
},
|
|
linux: { // https://www.electron.build/configuration/linux
|
|
target: 'AppImage',
|
|
},
|
|
},
|
|
},
|
|
},
|
|
});
|
|
|
|
function addWebpackRule(name, test, loader, config) {
|
|
config.module
|
|
.rule(name)
|
|
.test(test)
|
|
.use(loader)
|
|
.loader(loader)
|
|
.end();
|
|
}
|
|
|
|
function changeAppEntryPoint(entryPath, config) {
|
|
config.entry('app').clear().add(entryPath).end();
|
|
}
|
|
|
|
function loadVueAppRuntimeVariables() {
|
|
process.env.VUE_APP_VERSION = packageJson.version;
|
|
process.env.VUE_APP_NAME = packageJson.name;
|
|
process.env.VUE_APP_REPOSITORY_URL = packageJson.repository.url;
|
|
process.env.VUE_APP_HOMEPAGE_URL = packageJson.homepage;
|
|
process.env.VUE_APP_SLOGAN = packageJson.slogan;
|
|
}
|
|
|
|
function ignorePolyfills(...moduleNames) {
|
|
return moduleNames.reduce((obj, module) => {
|
|
obj[module] = false;
|
|
return obj;
|
|
}, {});
|
|
}
|
|
|
|
function getAliasesFromTsConfig() {
|
|
const { paths } = tsconfigJson.compilerOptions;
|
|
return Object.keys(paths).reduce((aliases, pathName) => {
|
|
const pathFolder = paths[pathName][0];
|
|
const aliasFolder = pathFolder.substring(0, pathFolder.length - 1); // trim * from end
|
|
const aliasName = pathName.substring(0, pathName.length - 2); // trim /* from end
|
|
const aliasPath = resolve(__dirname, aliasFolder);
|
|
aliases[aliasName] = aliasPath;
|
|
return aliases;
|
|
}, {});
|
|
}
|
|
|
|
function fixTestBuildWithModules() {
|
|
/*
|
|
Workaround for Vue CLI issue during tests breaks projects that rely on ES6 modules and mocha.
|
|
Setting VUE_CLI_TEST to true prevents the Vue CLI from altering the module transpilation.
|
|
This fix ensures `npm run build -- --mode test` works successfully.
|
|
See: https://github.com/vuejs/vue-cli/issues/7417
|
|
*/
|
|
if (process.env.NODE_ENV === 'test') {
|
|
process.env.VUE_CLI_TEST = true;
|
|
}
|
|
}
|