更多

Question

我正在尝试在NodeJS应用中通过Webpack加载Quill，但遇到此错误：

ERROR in ./node_modules/parchment/src/blot/scroll.ts 17:18
Module parse failed: Unexpected token (17:18)
You may need an appropriate loader to handle this file type.
|
| class ScrollBlot extends ContainerBlot {
>   static blotName = 'scroll';
|   static defaultChild = 'block';
|   static scope = Registry.Scope.BLOCK_BLOT;
 @ ./node_modules/parchment/src/parchment.ts 6:0-39 32:10-20
 @ ./node_modules/quill/core.js
 @ ./src/modules/Quill/quill.ts
 @ ./src/routes/Node/Demo/index.tsx
 @ ./src/routes/Node/index.tsx
 @ ./src/routes/index.tsx
 @ ./src/App.tsx
 @ ./src/index.tsx

由于Quill提供了example，但我无法正常工作，因此可以这样做。

我的webpack配置文件的缩写版本：

module.exports = {
    ...
    resolve: {
        alias: {
          'parchment': path.resolve(__dirname, '../node_modules/parchment/src/parchment.ts'),
          'quill$': path.resolve(__dirname, '../node_modules/quill/quill.js'),
        },
        extensions: ['.js', '.jsx', '.json', '.ts', '.tsx'],
    },
    rules: [
    {
        enforce: 'pre',
        test: /\.js$/,
        loader: 'source-map-loader',
        exclude: /node_modules/,
    },
    {
    test: /\.ts(x?)$/,
    use: [{
        loader: 'ts-loader',
        options: {
          compilerOptions: {
            declaration: false,
            target: 'es5',
            module: 'commonjs'
          },
          transpileOnly: true
        },
      }],
    },
    ...
};

还有一个缩写的package.json：

"dependencies": {
    "babel-core": "^6.26.3",
    "babel-loader": "^8.0.5",
    "babel-preset-es2015": "^6.24.1",
    "parchment": "^1.1.4",
    "quill": "^1.3.6",
    "ts-loader": "^4.5.0"
  },
  "devDependencies": {
    "@svgr/webpack": "^4.2.0",
    "@types/quill": "^2.0.2",
    "@types/webpack": "^4.4.19",
    "@types/webpack-env": "^1.13.6",
    "tslint": "^5.11.0",
    "tslint-config-airbnb": "^5.11.1",
    "tslint-config-prettier": "^1.16.0",
    "tslint-react": "^3.6.0",
    "tsutils": "^3.5.1",
    "typescript": "^2.8.3",
    "typings-for-css-modules-loader": "^1.7.0",
    "uglifyjs-webpack-plugin": "^2.0.1",
    "webpack": "^4.26.0",
    "webpack-cli": "^3.1.2",
    "webpack-dev-server": "^3.1.14",
    "webpack-merge": "^4.1.4"
  }
}

该错误表明ts-loader未编译scroll.ts，因为它认为static是意外令牌，但据我所知，装入程序已正确设置。

有什么想法我要去哪里吗？

Answer 1

您有

'parchment': path.resolve(__dirname, '../node_modules/parchment/src/parchment.ts'),

相反，您应该将其解析为生成的.js文件：

'parchment': path.resolve(__dirname, '../node_modules/parchment/dist/parchment.js'),

通过Webpack意外加载令牌

1 个答案:

更多