build issue

[flfeeling2016]

i am using ol with vue .when run script "npm run serve",i got bugs like this

ERROR Failed to compile with 2 errors 上午9:52:24

error in ./node_modules/_ol@7.5.1@ol/render/webgl/VectorStyleRenderer.js

Module parse failed: Unexpected token (142:35) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/conc epts#loaders | @private | /

this.hasFill_ = !!shaders.fill?.vertex;

| if (this.hasFill) { | this.fillVertexShader = shaders.fill.vertex;

@ ./node_modules/_ol@7.5.1@ol/renderer/webgl/VectorLayer.js 7:0-76 168:21-40 @ ./node_modules/_cache-loader@4.1.0@cache-loader/dist/cjs.js??ref--13-0!./node_modules/_babel-loader@8.3.0@babel-loader/lib!./node_modules/_cache-lo ader@4.1.0@cache-loader/dist/cjs.js??ref--1-0!./node_modules/_vue-loader@15.10.1@vue-loader/lib??vue-loader-options!./src/views/LeaderDemand.vue?vue&t ype=script&lang=js& @ ./src/views/LeaderDemand.vue?vue&type=script&lang=js& @ ./src/views/LeaderDemand.vue @ ./src/router/index.js @ ./src/main.js @ multi ./node_modules/_webpack-dev-server@3.11.3@webpack-dev-server/client?http://10.200.31.6:8081&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

error in ./node_modules/_ol@7.5.1@ol/renderer/webgl/PointsLayer.js

Module parse failed: Unexpected token (165:61) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/conc epts#loaders | @private | /

this.hitDetectionEnabled_ = options.hitDetectionEnabled ?? true;

| | const customAttributes = options.attributes

@ ./node_modules/_ol@7.5.1@ol/layer/WebGLPoints.js 5:0-72 109:15-39 @ ./node_modules/_cache-loader@4.1.0@cache-loader/dist/cjs.js??ref--13-0!./node_modules/_babel-loader@8.3.0@babel-loader/lib!./node_modules/_cache-lo ader@4.1.0@cache-loader/dist/cjs.js??ref--1-0!./node_modules/_vue-loader@15.10.1@vue-loader/lib??vue-loader-options!./src/views/LeaderDemand.vue?vue&t ype=script&lang=js& @ ./src/views/LeaderDemand.vue?vue&type=script&lang=js& @ ./src/views/LeaderDemand.vue @ ./src/router/index.js @ ./src/main.js @ multi ./node_modules/_webpack-dev-server@3.11.3@webpack-dev-server/client?http://10.200.31.6:8081&sockPath=/sockjs-node (webpack)/hot/dev-server.js ./src/main.js

[flfeeling2016]

it happened when using 7.5.1,webgl/vectorlayers

[jahow]

Optional chaining and the nullish coalescing operator are es6 language features, so I'd say that the dependencies you use for building are not suited and/or outdated.

But maybe I'm wrong and those kind of features should be transpiled when the library is published?

[ahocevar]

We publish untranspiled modern JavaScript, so if older ES versions are required, users have transpile OpenLayers as part of their build process. Usually there's a transpileDependencies option or similar in the build configuration, depending on the toolset used.

[m1328224904]

我们发布未转译的现代 JavaScript，因此如果需要较旧的 ES 版本，用户可以将转译 OpenLayers 作为其构建过程的一部分。transpileDependencies通常，构建配置中有一个选项或类似选项，具体取决于所使用的工具集。

Hello, configuring transpileDependencies using the OL installed by CNPM has not been effective. I hope you can try to avoid using these syntax in your next update as much as possible

[ahocevar]

@m1328224904 Maybe you configured something in the wrong way?

[m1328224904]

@m1328224904也许您以错误的方式配置了某些内容？

My configuration is not a problem module.exports = { publicPath: "./", // 公共路径(必须有的) outputDir: "dist", // 输出文件目录 lintOnSave: false, productionSourceMap: false, //去除打包后js的map文件 // runtimeCompiler: true, //关键点在这 devServer: { port: 6527, }, css: { loaderOptions: { sass: { additionalData: @import "@/assets/css/public.scss"; } } }, transpileDependencies: ['ol/renderer/webgl'] } The above are all my configuration codes. I am in China and often fail to download using NPM. I just used some special methods to make my NPM available, and there were no errors in the configuration of OL and transpileDependencies downloaded this time

[ahocevar]

Why not transpile all of ol? transpileDependencies: ['ol']. That's how this is usually done. I don't even think transpileDependencies accepts modules, it has to be configured with packages.

[m1328224904]

为什么不转译所有的ol呢？transpileDependencies: ['ol']通常。就是这样做的。我什至不认为transpileDependencies接受模块，它必须用包进行配置。

I just conducted a test, which is also feasible. The topic I want to say is that you need to consider users who use cnpm installation. After installing ol using cmpm, the transpileDependencies configuration will become invalid, or should you not use it?? Because I have reviewed the source code, there is only one place where I have used the syntax?? Grammar of

[m1328224904]

为什么不转译所有的 ol 呢？transpileDependencies: ['ol']。通常就是这样做的。我什至不认为transpileDependencies接受模块，它必须用包进行配置。

为什么不转译所有的ol呢？transpileDependencies: ['ol']通常。就是这样做的。我什至不认为transpileDependencies接受模块，它必须用包进行配置。

Or rather, I hope you can release the compiled version so that there won't be any issues

[foo4foo]

为什么不转译所有的 ol 呢？transpileDependencies: ['ol']。通常就是这样做的。我什至不认为transpileDependencies接受模块，它必须用包进行配置。

为什么不转译所有的ol呢？transpileDependencies: ['ol']通常。就是这样做的。我什至不认为transpileDependencies接受模块，它必须用包进行配置。

Or rather, I hope you can release the compiled version so that there won't be any issues

Indeed.

[haloxzp]

this.hitDetectionEnabled_ = options.hitDetectionEnabled ?? true;

I tried using transpileDependencies: ['ol'] configuration, but it still didn't work. My vue-cli:4.5.0

[ahocevar]

@haloxzp Did you configure transpileDependencies in the correct place?

[m1328224904]

this.hitDetectionEnabled_ = options.hitDetectionEnabled ?? true;

我尝试使用 transpileDependency: ['ol'] 配置，但仍然失效。我的 vue-cli:4.5.0

如果你是使用的cnpm安装，确实有可能不起作用，你可以尝试使用npm重新下载所有的包。或者你把this.hitDetectionEnabled_ = options.hitDetectionEnabled ?? true;这一句改一下，使用es5的语法

[ahocevar]

It's transpileDependencies (plural), not transpileDependency (singular).

[bcleuing]

Why not transpile all of ol? transpileDependencies: ['ol']. That's how this is usually done. I don't even think transpileDependencies accepts modules, it has to be configured with packages.

@ahocevar Thank you! I solved the issue by including the package "color-parse" as well in "transpileDependencies":

// vue.config.js
module.exports = {
  transpileDependencies: [
    "ol",
    "color-parse"
  ]
}

[Saumya-NebCodes]

Hello, I am facing the same issue in angular any idea how to resolve it?