我有这样的项目结构:
/main-folder
/apps
/app — // I want to import "project-b" here
/node_modules
/public
/src
|app.js
|app.css
|.babelrc
|package.json
|package-lock.json
|webpack.config.js
/static
/project-b — // Project that I want to export
/node_modules
/public
/src
/lib
...components
|.babelrc
|package.json
|package-lock.json
当我尝试导入没有类属性的组件时,一切都很好。
但是如果我导入具有类属性的组件:
我认为,如果我添加.babelrc
会起作用(我已将.babelrc
添加到app
和project-b
文件夹中,但仍然不起作用)
.babelrc:
{
"presets": ["@babel/preset-react","@babel/preset-env"],
"plugins": [
["@babel/plugin-proposal-class-properties", { "loose": true }]
]
}
app package.json:
{
"name": "auth",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"webpack": "webpack",
"start:dev": "webpack-dev-server",
"webpack:production": "webpack -p"
},
"author": "namename",
"license": "MIT",
"dependencies": {
"css-loader": "^1.0.1",
"entrl-ui-kit": "^1.0.3",
"file-loader": "^2.0.0",
"react": "^16.6.3",
"react-dom": "^16.6.3",
"react-router-dom": "^4.3.1",
"react-transition-group": "^2.5.0",
"style-loader": "^0.23.1"
},
"devDependencies": {
"@babel/core": "^7.1.6",
"@babel/plugin-proposal-class-properties": "^7.1.0",
"@babel/preset-env": "^7.1.6",
"@babel/preset-react": "^7.0.0",
"babel-loader": "^8.0.4",
"webpack": "^4.26.0",
"webpack-cli": "^3.1.2",
"webpack-dev-server": "^3.1.10"
}
}
project-b package.json:
{
"name": "project-b",
"version": "1.0.0",
"author": "namename",
"license": "MIT",
"main": "dist/index.js",
"module": "dist/index.js",
"files": [
"dist"
],
"scripts": {
"start": "react-scripts start",
"build-examples": "react-scripts build",
"test": "react-scripts test --env=jsdom",
"eject": "react-scripts eject",
"build": "rimraf ./build && mkdirp ./build && babel -d ./build ./src"
},
"devDependencies": {
"@babel/cli": "^7.1.5",
"@babel/plugin-proposal-class-properties": "^7.1.0",
"@babel/preset-react": "^7.0.0",
"babel-loader": "^8.0.0-beta.6",
"babel-preset-latest": "^6.24.1",
"mkdirp": "^0.5.1",
"react": "^16.6.3",
"react-dom": "^16.6.3",
"react-scripts": "^2.1.1",
"react-transition-group": "^2.5.0",
"rimraf": "^2.6.2"
},
"browserslist": [
">0.2%",
"not dead",
"not ie <= 11",
"not op_mini all"
],
"dependencies": {
"babel-core": "^7.0.0-bridge.0"
}
}
答案 0 :(得分:2)
我需要做的就是将babel.config.js
添加到根文件夹中:
感谢loganfsmyth!
/main-folder
|babel.config.js — //HERE!
/apps
/app — // I want to import "project-b" here
/node_modules
/public
/src
|app.js
|app.css
|.babelrc
|package.json
|package-lock.json
|webpack.config.js
/static
/project-b — // Project that I want to export
/node_modules
/public
/src
/lib
...components
|.babelrc
|package.json
|package-lock.json
babel.config.js:
module.exports = {
babelrcRoots: [
".",
"static/project-b/*"
]
};