[Bug Report] Dev build from source fails #18304

Tofandel · 2019-12-04T22:46:50Z

Element UI version

2.13.0

OS/Browsers version

Linux (Kubuntu 19)

Vue version

2.6.10

Reproduction Link

https://github.com/ElemeFE/element.git#dev

Steps to reproduce

Simply clone the dev branch

And run npm install && npm run dist

What is Expected?

The build process to run successfully

What is actually happening?

The build process fails at 89% with a ton of errors like the following

ERROR in ./packages/tooltip/src/main.js 81:8
Module parse failed: Unexpected token (81:8)
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/concepts#loaders
|     if (this.popperVM) {
|       this.popperVM.node = (
>         <transition
|           name={ this.transition }
|           onAfterLeave={ this.doDestroy }>
 @ ./packages/tooltip/index.js 1:0-33 4:0-7 5:16-23 5:30-37 8:15-22
 @ ./src/index.js
 @ multi ./src/index.js

It seems like the jsx loader is not correctly configured

The text was updated successfully, but these errors were encountered:

Linkontoask · 2019-12-05T06:28:37Z

I suspect that you made some errors during the installation, you can try to reinstall the dependencies. jsx is mainly compiled by transform-vue-jsx in babel

Tofandel · 2019-12-05T10:48:47Z

Already tried deleting node_modules and reinstalling, same issue, tried with a clean clone, same issue

Linkontoask · 2019-12-05T11:02:38Z

npm i yarn -g

You can try to reinstall dependencies using yarn

Tofandel · 2019-12-05T12:43:56Z

Just tried yarn install && yarn run dist on a clean clone
Getting the same issue

I got a warning during install
warning " > karma-webpack@3.0.5" has incorrect peer dependency "webpack@^2.0.0 || ^3.0.0".

Don't know if it's related

PS: I ruled out a possible global package conflict by uninstalling all my global packages

Tofandel · 2019-12-05T14:07:16Z

Webpack profiling output for one of the errors is:

{
          "id": 36,
          "identifier": "./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
          "name": "./node_modules/vue-loader/lib??vue-loader-options!./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
          "index": 51,
          "index2": 46,
          "size": 354,
          "cacheable": true,
          "built": true,
          "optional": false,
          "prefetched": false,
          "chunks": [
            0
          ],
          "issuer": "./element-ui/node_modules/vue-loader/lib/loaders/pitcher.js??ref--4!./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
          "issuerId": 35,
          "issuerName": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
          "issuerPath": [
            {
              "id": 98,
              "identifier": "multi ./src/index.js",
              "name": "multi ./src/index.js",
              "profile": {
                "factory": 1,
                "building": 4
              }
            },
            {
              "id": null,
              "identifier": "./element-ui/src/index.js",
              "name": "./src/index.js",
              "profile": {
                "factory": 44,
                "building": 30
              }
            },
            {
              "id": null,
              "identifier": "./element-ui/packages/dropdown/index.js",
              "name": "./packages/dropdown/index.js",
              "profile": {
                "factory": 194,
                "building": 95,
                "dependencies": 0
              }
            },
            {
              "id": 19,
              "identifier": "./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue",
              "name": "./packages/dropdown/src/dropdown.vue",
              "profile": {
                "factory": 378,
                "building": 187,
                "dependencies": 2312
              }
            },
            {
              "id": 35,
              "identifier": "./element-ui/node_modules/vue-loader/lib/loaders/pitcher.js??ref--4!./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "name": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "profile": {
                "factory": 2312,
                "building": 37
              }
            }
          ],
          "profile": {
            "factory": 35,
            "building": 40
          },
          "failed": true,
          "errors": 1,
          "warnings": 0,
          "assets": [],
          "reasons": [
            {
              "moduleId": 35,
              "moduleIdentifier": "./element-ui/node_modules/vue-loader/lib/loaders/pitcher.js??ref--4!./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "module": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "moduleName": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "type": "harmony side effect evaluation",
              "userRequest": "-!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./dropdown.vue?vue&type=script&lang=js&",
              "loc": "1:0-126"
            },
            {
              "moduleId": 35,
              "moduleIdentifier": "./element-ui/node_modules/vue-loader/lib/loaders/pitcher.js??ref--4!./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "module": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "moduleName": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "type": "harmony import specifier",
              "userRequest": "-!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./dropdown.vue?vue&type=script&lang=js&",
              "loc": "1:142-145"
            },
            {
              "moduleId": 35,
              "moduleIdentifier": "./element-ui/node_modules/vue-loader/lib/loaders/pitcher.js??ref--4!./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "module": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "moduleName": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "type": "harmony side effect evaluation",
              "userRequest": "-!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./dropdown.vue?vue&type=script&lang=js&",
              "loc": "1:147-270"
            },
            {
              "moduleId": 35,
              "moduleIdentifier": "./element-ui/node_modules/vue-loader/lib/loaders/pitcher.js??ref--4!./element-ui/node_modules/vue-loader/lib/index.js??vue-loader-options!./element-ui/packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "module": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "moduleName": "./packages/dropdown/src/dropdown.vue?vue&type=script&lang=js&",
              "type": "harmony export imported specifier",
              "userRequest": "-!../../../node_modules/vue-loader/lib/index.js??vue-loader-options!./dropdown.vue?vue&type=script&lang=js&",
              "loc": "1:147-270"
            }
          ],
          "usedExports": [
            "default"
          ],
          "providedExports": null,
          "optimizationBailout": [
            "ModuleConcatenation bailout: Module is not an ECMAScript module"
          ],
          "depth": 5,
          "source": "throw new Error(\"Module parse failed: Unexpected token (262:9)\\nYou may need an appropriate loader to handle this file type.\\n|     let triggerElm = !splitButton\\n|       ? this.$slots.default\\n>       : (<el-button-group>\\n|         <el-button type={type} size={dropdownSize} nativeOn-click={handleMainButtonClick}>\\n|           {this.$slots.default}\");"
},

Command used => webpack --config build/webpack.common.js --profile --json

The other webpack command runs fine (webpack --config build/webpack.component.js)

Hopefully that helps because I have no clue about what the problem is at this point

And being unable to compile from source is quite frustrating because I can't test changes and pull requests

Linkontoask · 2019-12-06T00:55:18Z

Can you post the current branch names, .babelrc, node and npm versions? I can restore your situation on my machine, because according to the information you told, I can't analyze the problem.

Tofandel · 2019-12-06T13:00:10Z

Branch is dev (It was in the url)
.babelrc is exactly the same
Npm: 6.13.1
Node: v10.15.2
Webpack: 4.41.2

Linkontoask · 2019-12-06T14:22:03Z

Please provide a reproduction repo | | Link | | 邮箱：linkorgs@163.com | Signature is customized by Netease Mail Master On 12/06/2019 21:00, Adrien Foulon wrote: Branch is dev (It was in the url) .babelrc is exactly the same Npm: 6.13.1 Node: v10.15.2 Webpack: 4.41.2 — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

Tofandel · 2019-12-06T14:56:57Z

Well I said that I'm cloning the original repo on dev, I don't see what a reproduction repo being exactly the same will add

I can add the node_modules folder but it's gonna be pretty much the same since it seems being environment related

(maybe a path variable story like vue cli)

Linkontoask · 2019-12-07T00:35:32Z

Sorry, I responded directly in the mailbox, only to find that the reply was wrong. I will try to recover your problem to help you | | Link | | 邮箱：linkorgs@163.com | Signature is customized by Netease Mail Master On 12/06/2019 22:56, Adrien Foulon wrote: Well I said that I'm cloning the original repo on dev, I don't see what a reproduction repo being exactly the same will add — You are receiving this because you commented. Reply to this email directly, view it on GitHub, or unsubscribe.

Linkontoask · 2019-12-07T07:49:36Z

I use the same environment / command as you, but it doesn't happen to you, I don't think this is a problem with Element
@Tofandel sorry I can't help you

Tofandel · 2019-12-20T13:15:18Z

I finally figured it out...

For some reason if the directory is cloned into another node_modules directory (eg: my_project/node_modules/element-ui/)

Then the build fails, if not then all works correctly, I'm guessing there is something wrong with how directory are handled on the jsx vue plugin

Tofandel · 2020-01-13T11:52:26Z

Having found the source of the bug and a solution for it I will reopen this until a PR fixes the config

Issue is in lib/config.js

exports.jsexclude = /node_modules|utils\/popper\.js|utils\/date\.js/;

Because the regex doesn't care about the tree directory, if the project is under a node modules directory, everything will be excluded

Replacing it with
exports.jsexclude = [path.resolve('./node_modules'), path.resolve('./utils', 'popper.js'), path.resolve('./utils', 'date.js')]
Fixed the issue

…ctory named 'node_modules') Instead of a regex for exclusion, this PR resolves the actual path for the excluded files

stale · 2022-04-29T05:39:36Z

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

Tofandel closed this as completed Dec 20, 2019

Tofandel reopened this Jan 13, 2020

Tofandel added a commit to Tofandel/element that referenced this issue Jan 13, 2020

Fix ElemeFE#18304 (Compilation fails when the project is under a dire…

4e55f09

…ctory named 'node_modules') Instead of a regex for exclusion, this PR resolves the actual path for the excluded files

Tofandel mentioned this issue Jan 13, 2020

Compilation: Fix #18304 (Compilation fails when the project is under a node_modules directory) #18688

Closed

3 tasks

stale bot added the stale label Apr 29, 2022

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

[Bug Report] Dev build from source fails #18304

[Bug Report] Dev build from source fails #18304

Tofandel commented Dec 4, 2019 •

edited

Loading

Linkontoask commented Dec 5, 2019

Tofandel commented Dec 5, 2019

Linkontoask commented Dec 5, 2019

Tofandel commented Dec 5, 2019 •

edited

Loading

Tofandel commented Dec 5, 2019 •

edited

Loading

Linkontoask commented Dec 6, 2019

Tofandel commented Dec 6, 2019 •

edited

Loading

Linkontoask commented Dec 6, 2019 via email

Tofandel commented Dec 6, 2019 •

edited

Loading

Linkontoask commented Dec 7, 2019 via email

Linkontoask commented Dec 7, 2019

Tofandel commented Dec 20, 2019

Tofandel commented Jan 13, 2020 •

edited

Loading

stale bot commented Apr 29, 2022

[Bug Report] Dev build from source fails #18304

[Bug Report] Dev build from source fails #18304

Comments

Tofandel commented Dec 4, 2019 • edited Loading

Element UI version

OS/Browsers version

Vue version

Reproduction Link

Steps to reproduce

What is Expected?

What is actually happening?

Linkontoask commented Dec 5, 2019

Tofandel commented Dec 5, 2019

Linkontoask commented Dec 5, 2019

Tofandel commented Dec 5, 2019 • edited Loading

Tofandel commented Dec 5, 2019 • edited Loading

Linkontoask commented Dec 6, 2019

Tofandel commented Dec 6, 2019 • edited Loading

Linkontoask commented Dec 6, 2019 via email

Tofandel commented Dec 6, 2019 • edited Loading

Linkontoask commented Dec 7, 2019 via email

Linkontoask commented Dec 7, 2019

Tofandel commented Dec 20, 2019

Tofandel commented Jan 13, 2020 • edited Loading

stale bot commented Apr 29, 2022

Tofandel commented Dec 4, 2019 •

edited

Loading

Tofandel commented Dec 5, 2019 •

edited

Loading

Tofandel commented Dec 5, 2019 •

edited

Loading

Tofandel commented Dec 6, 2019 •

edited

Loading

Tofandel commented Dec 6, 2019 •

edited

Loading

Tofandel commented Jan 13, 2020 •

edited

Loading