Я пытаюсь установить TypeScript на наш маркетинговый сайт. Использование:
vue add typescript
После установки я получаю сообщение об ошибке:
Module build failed (from ./node_modules/thread-loader/dist/cjs.js):
Thread Loader (Worker 0)
Failed to load plugin @typescript-eslint: Cannot find module 'eslint-plugin-@typescript-eslint'
Что я пробовал:
- Установка
eslint-plugin-@typescript-eslint
- Обновление NPM пакетов, включая
@vue/eslint-config-typescript
- Использование require вместо импорта в
main.ts
- Возиться с конфигами в
vue.config.js
, но не повезло - Обновление Vue CLI
В настоящее время используется @vue/cli 4.1.2
Есть идеи?
vue.config.js
file:
const preRender = require('prerender-spa-plugin');
const UglifyJsPlugin = require('uglifyjs-webpack-plugin');
const isProd = process.env.NODE_ENV === 'production';
const path = require('path');
module.exports = {
chainWebpack: config => {
config.module
.rule('svg')
.use('file-loader')
.loader('vue-svg-loader');
},
configureWebpack: () => {
{
isProd
? [
new UglifyJsPlugin({
uglifyOptions: {
compress: {
drop_console: true
}
}
})
]
: [];
}
if (process.env.NODE_ENV !== 'production') return;
return {
plugins: [
new preRender(path.resolve(__dirname, 'dist'), [
'/',
])
],
watchOptions: {
aggregateTimeout: 300,
poll: 1000
}
};
},
css: {
loaderOptions: {
scss: {
prependData: '@import "@/app.scss";'
}
},
sourceMap: true
}
};
tsconfig.json
файл;
{
"compilerOptions": {
"target": "esnext",
"module": "esnext",
"strict": true,
"jsx": "preserve",
"importHelpers": true,
"moduleResolution": "node",
"experimentalDecorators": true,
"esModuleInterop": true,
"allowSyntheticDefaultImports": true,
"sourceMap": true,
"baseUrl": ".",
"types": [
"webpack-env",
"jest"
],
"paths": {
"@/*": [
"src/*"
]
},
"lib": [
"esnext",
"dom",
"dom.iterable",
"scripthost"
]
},
"include": [
"src/**/*.ts",
"src/**/*.tsx",
"src/**/*.vue",
"tests/**/*.ts",
"tests/**/*.tsx"
],
"exclude": [
"node_modules"
]
}
main.ts
файл:
import Vue from 'vue';
import App from './App.vue';
import router from './router';
import VueTouch from 'vue-touch';
import VueAnalytics from 'vue-analytics';
const isProd = process.env.NODE_ENV === 'production';
Vue.use(VueAnalytics, {
id: process.env.VUE_APP_GA,
router,
debug: {
enabled: false,
sendHitTask: isProd
}
});
Vue.use(VueTouch);
Vue.config.productionTip = false;
new Vue({
router,
render: h => h(App)
}).$mount('#app');