Я хочу импортировать сторонние библиотеки, я использую vuepress. Я должен настроить правило для компиляции файла node_modules js. но это не работает.
как это
демо. vue
<template>
<DatePanel/>
</template>
<script>
import DatePanel from 'element-ui/packages/date-picker/src/panel/date-range.vue';
export default {
name: 'date-pick',
components: {
DatePanel
}
}
</script>
документы / .vuepress / config. js
module.exports = {
// here is my config
chainWebpack: (config, isServer) => {
config.module
.rule('compile')
.test(/\.js$/)
.include
.add(resolve('node_modules/element-ui/packages'))
.add(resolve('node_modules/element-ui/src'))
.end()
.exclude
.add(resolve('node_modules/element-ui/src/utils/date.js'))
.end()
.use("babel-loader")
.loader('babel-loader')
.tap(options =>
merge(options, {
presets: [
'@vue/app'
]
})
);
}
}
ошибка формы devtools
main.js:1 Uncaught Error: Module parse failed: Unexpected token (65:6)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
| }, this.$slots.default);
| const wrap = (
> <div
| ref="wrap"
| style={ style }
at eval (main.js:1)
at Object../node_modules/element-ui/packages/scrollbar/src/main.js (app.js:4201)
at __webpack_require__ (app.js:770)
at fn (app.js:130)
at eval (index.js?2020:1)
at Module../node_modules/element-ui/packages/scrollbar/index.js (app.js:4190)
at __webpack_require__ (app.js:770)
at fn (app.js:130)
at eval (cjs.js?!./node_modules/@vuepress/core/node_modules/vue-loader/lib/index.js?!./node_modules/element-ui/packages/date-picker/src/basic/time-spinner.vue?vue&type=script&lang=js&:3)
at Module../node_modules/@vuepress/core/node_modules/cache-loader/dist/cjs.js?!./node_modules/@vuepress/core/node_modules/vue-loader/lib/index.js?!./node_modules/element-ui/packages/date-picker/src/basic/time-spinner.vue?vue&type=script&lang=js& (app.js:1520)
Как настроить chainWebpack
и как я могу решить эту проблему.