Я знаю, что есть много подобных проблем, но я серьезно запутался, прочитав много веток об этом, но все еще не смог решить мою проблему.
Я впервые использую single-spa
для микро-интерфейса, но я застрял в первой части.
Это ошибка, которую я получил:
ОШИБКА в ./single-spa.config.js Сборка модуля завершилась неудачно (из ./node_modules/babel-loader/lib/index.js): Ошибка: файлы плагинов / предустановок не позволяют экспортировать объекты, только функции , В D: \ Gitpanda \ singlespatest \ node_modules \ babel-preset-реагировать \ lib \ index. js в createDescriptor (D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-descriptors. js : 178: 11) в items.map (D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-descriptors. js: 109: 50) в Array.map () в createDescriptors (D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-descriptors. js: 109: 29) в createPresetDescriptors (D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-descriptors . js: 101: 10) в пресетах (D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-descriptors. js: 47: 19) в mergeChainOpts (D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-chain. js: 320: 26) в D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-chain. js: 283 : 7 в Generator.next () в buildRootChain (D: \ Gitpanda \ singlespatest \ node_modules@babel \ core \ lib \ config \ config-chain. js: 120: 29) i 「wdm」: Не удалось скомпилировать.
Прочитав много топи c об этой проблеме, я возможно, эта ошибка возникает из-за версии babel
, но когда я пытаюсь добавить и instal
пресет, так как я использую babel-loader@8
, я должен установить babel-core@7
, но ошибка все еще существует.
это мой пакет. json:
"dependencies": {
"@babel/core": "^7.8.4",
"@babel/preset-env": "^7.8.4",
"react": "^16.12.0",
"react-dom": "^16.12.0",
"react-router-dom": "^5.1.2",
"single-spa": "^5.0.0",
"single-spa-react": "^2.11.0"
},
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^8.0.6",
"babel-plugin-syntax-dynamic-import": "^6.18.0",
"babel-plugin-transform-object-rest-spread": "^6.26.0",
"babel-preset-env": "^1.7.0",
"babel-preset-latest": "^6.24.1",
"babel-preset-react": "^6.24.1",
"clean-webpack-plugin": "^3.0.0",
"css-loader": "^3.4.2",
"html-loader": "^0.5.5",
"style-loader": "^1.1.3",
"webpack": "^4.41.6",
"webpack-cli": "^3.3.11",
"webpack-dev-server": "^3.10.3"
}
это мой .babelr c:
{
"presets": [
["env", {
"targets": {
"browsers": ["last 2 versions"]
}
}],
"@babel/preset-env",
["react"]
],
"plugins": [
"syntax-dynamic-import",
"transform-object-rest-spread"
]
}
и это my webpack.config:
const path = require('path');
const webpack = require('webpack');
// const CleanWebpackPlugin = require('clean-webpack-plugin');
const { CleanWebpackPlugin } = require('clean-webpack-plugin');
module.exports = {
mode: 'development',
entry: {
// Set the single-spa config as the project entry point
'single-spa.config': 'single-spa.config.js',
},
output: {
publicPath: '/dist/',
filename: '[name].js',
path: path.resolve(__dirname, 'dist'),
},
module: {
rules: [
{
// Webpack style loader added so we can use materialize
test: /\.css$/,
use: ['style-loader', 'css-loader']
},
{
test: /\.js$/,
exclude: [path.resolve(__dirname, 'node_modules')],
loader: 'babel-loader',
},
{
// This plugin will allow us to use html templates when we get to the angularJS app
test: /\.html$/,
exclude: /node_modules/,
loader: 'html-loader',
},
],
},
node: {
fs: 'empty'
},
resolve: {
modules: [
__dirname,
'node_modules',
],
},
plugins: [
// A webpack plugin to remove/clean the build folder(s) before building
// new CleanWebpackPlugin(['dist']),
new CleanWebpackPlugin(),
],
devtool: 'source-map',
externals: [],
devServer: {
historyApiFallback: true
}
};
Если вам интересно, что я хочу сделать, на самом деле я просто следую этому уроку в здесь
Может кто-нибудь помочь мне решить это? Я уже запутался в этом