Question

我正在尝试将@magento/peregrine中的import '@magento/peregrine';加载到.storybook/addons.js插件中。使用Storybook React v5.2.1。加载所有其他插件都可以正常工作。

错误：

ModuleParseError：   模块解析失败：意外的令牌（10:12）   当前，您可能需要适当的加载器来处理此文件类型   没有配置任何加载程序来处理此文件。看到   https://webpack.js.org/concepts#loaders | |返回（
        <RouteConsumer> |                 {context => <MagentoRouteHandler {...props} {...context} />} |            
        在handleParseError（/home/storybook/bank/node_modules/webpack/lib/NormalModule.js:461:19）         在doBuild.err（/home/storybook/bank/node_modules/webpack/lib/NormalModule.js:495:5）         在runLoaders（/home/storybook/bank/node_modules/webpack/lib/NormalModule.js:354:12）         在/home/storybook/bank/node_modules/loader-runner/lib/LoaderRunner.js:373:3         在iterateNormalLoaders（/home/storybook/bank/node_modules/loader-runner/lib/LoaderRunner.js:214:10）         在阵列。（/home/storybook/bank/node_modules/loader-runner/lib/LoaderRunner.js:205:4）         在Storage.finished（/home/storybook/bank/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:43:16）         在提供程序处（/home/storybook/bank/node_modules/enhanced-resolve/lib/CachedInputFileSystem.js:79:9）         在/home/storybook/bank/node_modules/graceful-fs/graceful-fs.js:115:16         在FSReqWrap.readFileAfterClose [完成时]（内部/fs/read_file_context.js:53:3）

我的webpack.config.js：

const path = require('path');

module.exports = async ({ config, mode }) => {
    config.module.rules.unshift({
        test: /\.stories\.js?$/,
        loaders: [require.resolve('@storybook/source-loader')],
        enforce: 'pre'
    });
    return config;
};

package.json：

{
  "name": "bank",
  "version": "0.1.0",
  "private": true,
  "dependencies": {
    "@magento/peregrine": "^4.1.0-dev.0",
    "@storybook/addon-a11y": "^5.2.1",
    "@storybook/addon-options": "^5.2.1",
    "@storybook/addon-storyshots": "^5.2.1",
    "@storybook/addon-storysource": "^5.2.1",
    "apollo-boost": "^0.4.4",
    "apollo-server": "^2.9.4",
    "apollo-server-express": "^2.9.4",
    "babel-plugin-macros": "^2.6.1",
    "file-loader": "^4.2.0",
    "graphql": "^14.5.8",
    "graphql-tag": "^2.10.1",
    "node-sass-chokidar": "^1.3.5",
    "peregrine": "0.0.1",
    "react": "^16.10.1",
    "react-apollo": "^3.1.2",
    "react-dom": "^16.10.1",
    "react-router-dom": "^5.1.2",
    "react-scripts": "^3.1.1",
    "react-test-renderer": "^16.10.1",
    "redux-actions": "^2.6.5",
    "redux-thunk": "^2.3.0",
    "require-context.macro": "^1.2.2",
    "trunx": "^0.25.2",
    "url-loader": "^2.1.0",
    "yarn": "^1.19.0"
  },
  "scripts": {
    "build-css": "node-sass-chokidar src/ -o src/",
    "watch-css": "npm run build-css && node-sass-chokidar src/ -o src/ --watch --recursive",
    "storybook": "start-storybook -p 9001 -c .storybook -s public",
    "start-react": "react-scripts start",
    "start": "npm-run-all -p watch-css start-react",
    "build-react": "react-scripts build",
    "build": "npm-run-all -s build-css build-react",
    "test": "react-scripts test --env=jsdom",
    "eject": "react-scripts eject"
  },
  "eslintConfig": {
    "extends": "react-app"
  },
  "browserslist": {
    "production": [
      ">0.2%",
      "not dead",
      "not op_mini all"
    ],
    "development": [
      "last 1 chrome version",
      "last 1 firefox version",
      "last 1 safari version"
    ]
  },
  "devDependencies": {
    "@storybook/addon-actions": "^5.2.1",
    "@storybook/addon-info": "^5.2.1",
    "@storybook/addon-knobs": "^5.2.1",
    "@storybook/addon-viewport": "^5.2.1",
    "@storybook/react": "^5.2.1",
    "@types/storybook__addon-info": "^4.1.2",
    "storybook-addon-jsx": "^7.1.6",
    "storybook-addon-smart-knobs": "^5.0.0",
    "storybook-react-router": "^1.0.8"
  }
}

模块解析错误：未配置任何加载程序来处理此文件

0 个答案: