我目前正在使用React，flow类型的客户端应用程序，并使用webpack 3.11对其进行打包，到目前为止一切正常。
仅仅因为应用程序开始变得有点太大，我决定将一些React组件移动到他们自己的包中，将它们移动到自己的文件夹，设置package.json然后通过执行{{}}来安装它们{1}}之后，webpack开始抱怨，因为它无法解析我的流注释。
错误示例
yarn add ./path/to/package --dev我已经阅读了有关编译我的资产并在我的应用中使用精简版javascript的内容，但这是一个额外的构建步骤，我宁愿避免，因为我不计划在其他地方使用此软件包，而我的webpack设置已经处理了流程类型就好了。
.babelrc
Module parse failed: Unexpected token (15:7)
You may need an appropriate loader to handle this file type.
| import "./BaseTree.css";
|
| export type Tree = {
| name: NodeName,
| parent: ?NodeName,
webpack.config.js （由{
"presets": [
[
"env",
{
"targets": {
"node": "current",
"browsers": ["last 3 versions"]
}
}
],
"jest",
"react",
"flow"
],
"plugins": ["transform-class-properties"]
}
生成）
@symfony/webpack-encoreTL; DR版
使用{
"context": "/vhosts/app",
"entry": {
"main": "./assets/modules/main.js",
},
"output": {
"path": "/vhosts/app/public/build",
"filename": "[name].js",
"publicPath": "/build/",
"pathinfo": true
},
"module": {
"rules": [
{
"test": {},
"exclude": {},
"use": [
{
"loader": "babel-loader",
"options": {
"cacheDirectory": true
}
}
]
},
{
"test": {},
"use": [
{
"loader": "/vhosts/app/node_modules/extract-text-webpack-plugin/dist/loader.js",
"options": {
"omit": 1,
"remove": true
}
},
{
"loader": "style-loader?sourceMap"
},
{
"loader": "css-loader",
"options": {
"minimize": false,
"sourceMap": true,
"importLoaders": 1
}
},
{
"loader": "postcss-loader",
"options": {
"sourceMap": true
}
}
]
},
{
"test": {},
"loader": "file-loader",
"options": {
"name": "images/[name].[hash:8].[ext]",
"publicPath": "/build/"
}
},
{
"test": {},
"loader": "file-loader",
"options": {
"name": "fonts/[name].[hash:8].[ext]",
"publicPath": "/build/"
}
}
]
},
"plugins": [
{
"filename": "[name].css",
"id": 1,
"options": {
"allChunks": false
}
},
{
"entriesToDelete": []
},
{
"opts": {
"basePath": "build/",
"publicPath": "/build/",
"fileName": "manifest.json",
"stripSrc": null,
"transformExtensions": {},
"writeToFileEmit": true,
"cache": null
}
},
{
"options": {
"debug": true,
"options": {
"context": "/vhosts/app",
"output": {
"path": "/vhosts/app/public/build"
}
},
"test": {}
}
},
{
"options": {}
},
{
"definitions": {
"$": "jquery",
"jQuery": "jquery",
"window.jQuery": "jquery"
}
},
{
"paths": [
"**/*"
],
"options": {
"root": "/vhosts/app/public/build",
"verbose": false,
"allowExternal": false,
"dry": false
}
},
{
"definitions": {
"process.env": {
"NODE_ENV": "\"development\""
}
}
},
{
"compilationSuccessInfo": {
"messages": []
},
"shouldClearConsole": false,
"formatters": [
null,
null,
null,
null,
null,
null
],
"transformers": [
null,
null,
null,
null,
null,
null
]
},
{
"outputPath": "public/build",
"friendlyErrorsPlugin": {
"compilationSuccessInfo": {
"messages": []
},
"shouldClearConsole": false,
"formatters": [
null,
null,
null,
null,
null,
null
],
"transformers": [
null,
null,
null,
null,
null,
null
]
}
}
],
"devtool": "inline-source-map",
"performance": {
"hints": false
},
"stats": {
"hash": false,
"version": false,
"timings": false,
"assets": false,
"chunks": false,
"maxModules": 0,
"modules": false,
"reasons": false,
"children": false,
"source": false,
"errors": false,
"errorDetails": false,
"warnings": false,
"publicPath": false
},
"resolve": {
"extensions": [
".js",
".jsx",
".vue",
".ts",
".tsx"
],
"alias": {}
},
"externals": {}
}
类型编写应用。
还有使用flow类型编写的自己的npm包，只能在该应用程序上使用。
我可以设置webpack，以便它删除我的应用程序代码和包的类型吗？