问:
Unable to deploy a Rails 6 app using d3. Runs locally but Heroku build breaks: ModuleNotFoundError: Module not found: Error: Can't resolve 'd3'
I import d3 like this in a module:

```<code>import * as d3 from "d3"
</code>```

And the app works as intended on localhost, along with producing the desired charts. But when I push to heroku, precompilation fails.

I have not touched any webpack or webpacker configuration, everything is as it was provided by Rails.

I didn't find much mention of this situation apart from one where it was resolved by providing the direct path to d3 in the import statement. I tried this but the errors were unchanged.

Any ideas on how to resolve this and ensure a successful deployment to Heroku?

Thank you!

package.json

```<code>{
  "name": "the_app",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "4.2.2",
    "turbolinks": "^5.2.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "d3": "^5.16.0",
    "webpack-dev-server": "^3.10.3"
  }
}

</code>```

The errors

```<code>remote: -----> Preparing app for Rails asset pipeline
remote:        Running: rake assets:precompile
remote:        yarn install v1.16.0
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@1.2.12: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.12" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > webpack-dev-server@3.10.3" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
remote:        warning "webpack-dev-server > webpack-dev-middleware@3.7.2" has unmet peer dependency "webpack@^4.0.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 23.83s.
remote:        yarn install v1.16.0
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@1.2.12: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.12" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > webpack-dev-server@3.10.3" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
remote:        warning "webpack-dev-server > webpack-dev-middleware@3.7.2" has unmet peer dependency "webpack@^4.0.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 4.98s.
remote:        I, [2020-05-28T00:58:16.236509 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/application-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css
remote:        I, [2020-05-28T00:58:16.236817 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/application-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css.gz
remote:        I, [2020-05-28T00:58:16.237059 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/main-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css
remote:        I, [2020-05-28T00:58:16.237229 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/main-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css.gz
remote:        Compiling...
remote:        Compilation failed:
remote:        ModuleNotFoundError: Module not found: Error: Can't resolve 'd3' in '/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/modules'
remote:            at factory.create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/Compilation.js:925:10)
remote:            at factory (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:401:22)
remote:            at resolver (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:130:21)
remote:            at asyncLib.parallel (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:224:22)
remote:            at /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/neo-async/async.js:2830:7
remote:            at /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/neo-async/async.js:6877:13
remote:            at normalResolver.resolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:214:25)
remote:            at doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:213:14)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn41 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:28:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/ModuleKindPlugin.js:30:40)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn1 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:16:1)
remote:            at args (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/forEachBail.js:30:14)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn42 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:16:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
remote:        resolve 'd3' in '/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/modules'
remote:          Parsed request is a module
remote:          using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./app/javascript/modules)
remote:            Field 'browser' doesn't contain a valid alias configuration
remote:            resolve as module
remote:              looking for modules in /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript
remote:                using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./app/javascript)
remote:                  Field 'browser' doesn't contain a valid alias configuration
remote:                  using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./app/javascript/d3)
remote:                    no extension
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3 doesn't exist
remote:                    .mjs
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.mjs doesn't exist
remote:                    .js
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.js doesn't exist
remote:                    .sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.sass doesn't exist
remote:                    .scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.scss doesn't exist
remote:                    .css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.css doesn't exist
remote:                    .module.sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.module.sass doesn't exist
remote:                    .module.scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.module.scss doesn't exist
remote:                    .module.css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.module.css doesn't exist
remote:                    .png
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.png doesn't exist
remote:                    .svg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.svg doesn't exist
remote:                    .gif
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.gif doesn't exist
remote:                    .jpeg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.jpeg doesn't exist
remote:                    .jpg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.jpg doesn't exist
remote:                    as directory
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3 doesn't exist
remote:              /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/modules/node_modules doesn't exist or is not a directory
remote:              /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/node_modules doesn't exist or is not a directory
remote:              /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/node_modules doesn't exist or is not a directory
remote:              /tmp/node_modules doesn't exist or is not a directory
remote:              /node_modules doesn't exist or is not a directory
remote:              looking for modules in /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules
remote:                using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./node_modules)
remote:                  Field 'browser' doesn't contain a valid alias configuration
remote:                  using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./node_modules/d3)
remote:                    no extension
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3 doesn't exist
remote:                    .mjs
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.mjs doesn't exist
remote:                    .js
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.js doesn't exist
remote:                    .sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.sass doesn't exist
remote:                    .scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.scss doesn't exist
remote:                    .css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.css doesn't exist
remote:                    .module.sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.module.sass doesn't exist
remote:                    .module.scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.module.scss doesn't exist
remote:                    .module.css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.module.css doesn't exist
remote:                    .png
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.png doesn't exist
remote:                    .svg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.svg doesn't exist
remote:                    .gif
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.gif doesn't exist
remote:                    .jpeg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.jpeg doesn't exist
remote:                    .jpg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.jpg doesn't exist
remote:                    as directory
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3 doesn't exist
remote:
remote:
remote:  !
remote:  !     Precompiling assets failed.
remote:  !
remote:  !     Push rejected, failed to compile Ruby app.
remote:
remote:  !     Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to the-app
</code>```

答:
The issue was that I had installed d3 as a dev only dependency as seen in the package.json file.  </p>

```<code>yarn add d3
</code>```

<p>solved the issue. </p>

Body:
I import d3 like this in a module:

import * as d3 from "d3"

And the app works as intended on localhost, along with producing the desired charts. But when I push to heroku, precompilation fails.

I have not touched any webpack or webpacker configuration, everything is as it was provided by Rails.

I didn't find much mention of this situation apart from one where it was resolved by providing the direct path to d3 in the import statement. I tried this but the errors were unchanged.

Any ideas on how to resolve this and ensure a successful deployment to Heroku?

Thank you!

package.json

{
  "name": "the_app",
  "private": true,
  "dependencies": {
    "@rails/actioncable": "^6.0.0",
    "@rails/activestorage": "^6.0.0",
    "@rails/ujs": "^6.0.0",
    "@rails/webpacker": "4.2.2",
    "turbolinks": "^5.2.0"
  },
  "version": "0.1.0",
  "devDependencies": {
    "d3": "^5.16.0",
    "webpack-dev-server": "^3.10.3"
  }
}

The errors

remote: -----> Preparing app for Rails asset pipeline
remote:        Running: rake assets:precompile
remote:        yarn install v1.16.0
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@1.2.12: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.12" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > webpack-dev-server@3.10.3" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
remote:        warning "webpack-dev-server > webpack-dev-middleware@3.7.2" has unmet peer dependency "webpack@^4.0.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 23.83s.
remote:        yarn install v1.16.0
remote:        [1/4] Resolving packages...
remote:        [2/4] Fetching packages...
remote:        info fsevents@1.2.12: The platform "linux" is incompatible with this module.
remote:        info "fsevents@1.2.12" is an optional dependency and failed compatibility check. Excluding it from installation.
remote:        [3/4] Linking dependencies...
remote:        warning " > webpack-dev-server@3.10.3" has unmet peer dependency "webpack@^4.0.0 || ^5.0.0".
remote:        warning "webpack-dev-server > webpack-dev-middleware@3.7.2" has unmet peer dependency "webpack@^4.0.0".
remote:        [4/4] Building fresh packages...
remote:        Done in 4.98s.
remote:        I, [2020-05-28T00:58:16.236509 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/application-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css
remote:        I, [2020-05-28T00:58:16.236817 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/application-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css.gz
remote:        I, [2020-05-28T00:58:16.237059 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/main-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css
remote:        I, [2020-05-28T00:58:16.237229 #435]  INFO -- : Writing /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/public/assets/main-e9ef9b65582d84e0bcb1825908e96a08d055278ce584c687748a7dbd3a739747.css.gz
remote:        Compiling...
remote:        Compilation failed:
remote:        ModuleNotFoundError: Module not found: Error: Can't resolve 'd3' in '/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/modules'
remote:            at factory.create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/Compilation.js:925:10)
remote:            at factory (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:401:22)
remote:            at resolver (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:130:21)
remote:            at asyncLib.parallel (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:224:22)
remote:            at /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/neo-async/async.js:2830:7
remote:            at /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/neo-async/async.js:6877:13
remote:            at normalResolver.resolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/lib/NormalModuleFactory.js:214:25)
remote:            at doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:213:14)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn41 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:28:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/ModuleKindPlugin.js:30:40)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn1 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:16:1)
remote:            at args (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/forEachBail.js:30:14)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/UnsafeCachePlugin.js:44:7)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:15:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
remote:            at resolver.doResolve (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/DescriptionFilePlugin.js:67:43)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn42 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:16:1)
remote:            at hook.callAsync (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/webpack/node_modules/enhanced-resolve/lib/Resolver.js:285:5)
remote:            at _fn0 (eval at create (/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/tapable/lib/HookCodeFactory.js:33:10), <anonymous>:27:1)
remote:        resolve 'd3' in '/tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/modules'
remote:          Parsed request is a module
remote:          using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./app/javascript/modules)
remote:            Field 'browser' doesn't contain a valid alias configuration
remote:            resolve as module
remote:              looking for modules in /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript
remote:                using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./app/javascript)
remote:                  Field 'browser' doesn't contain a valid alias configuration
remote:                  using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./app/javascript/d3)
remote:                    no extension
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3 doesn't exist
remote:                    .mjs
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.mjs doesn't exist
remote:                    .js
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.js doesn't exist
remote:                    .sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.sass doesn't exist
remote:                    .scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.scss doesn't exist
remote:                    .css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.css doesn't exist
remote:                    .module.sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.module.sass doesn't exist
remote:                    .module.scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.module.scss doesn't exist
remote:                    .module.css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.module.css doesn't exist
remote:                    .png
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.png doesn't exist
remote:                    .svg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.svg doesn't exist
remote:                    .gif
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.gif doesn't exist
remote:                    .jpeg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.jpeg doesn't exist
remote:                    .jpg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3.jpg doesn't exist
remote:                    as directory
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/d3 doesn't exist
remote:              /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/modules/node_modules doesn't exist or is not a directory
remote:              /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/javascript/node_modules doesn't exist or is not a directory
remote:              /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/app/node_modules doesn't exist or is not a directory
remote:              /tmp/node_modules doesn't exist or is not a directory
remote:              /node_modules doesn't exist or is not a directory
remote:              looking for modules in /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules
remote:                using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./node_modules)
remote:                  Field 'browser' doesn't contain a valid alias configuration
remote:                  using description file: /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/package.json (relative path: ./node_modules/d3)
remote:                    no extension
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3 doesn't exist
remote:                    .mjs
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.mjs doesn't exist
remote:                    .js
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.js doesn't exist
remote:                    .sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.sass doesn't exist
remote:                    .scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.scss doesn't exist
remote:                    .css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.css doesn't exist
remote:                    .module.sass
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.module.sass doesn't exist
remote:                    .module.scss
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.module.scss doesn't exist
remote:                    .module.css
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.module.css doesn't exist
remote:                    .png
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.png doesn't exist
remote:                    .svg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.svg doesn't exist
remote:                    .gif
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.gif doesn't exist
remote:                    .jpeg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.jpeg doesn't exist
remote:                    .jpg
remote:                      Field 'browser' doesn't contain a valid alias configuration
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3.jpg doesn't exist
remote:                    as directory
remote:                      /tmp/build_ee117d42c87cfaf2c16b46c6bf931917/node_modules/d3 doesn't exist
remote:
remote:
remote:  !
remote:  !     Precompiling assets failed.
remote:  !
remote:  !     Push rejected, failed to compile Ruby app.
remote:
remote:  !     Push failed
remote: Verifying deploy...
remote:
remote: ! Push rejected to the-app

Body:
The issue was that I had installed d3 as a dev only dependency as seen in the package.json file.

yarn add d3

solved the issue.


来源: stackexchange

问:
How deal with Option<Ref<T>> and Option<&T>
In the example we assume that we have two codes that has their perimeter and tested individually.

The code 1 return the type Option<Rc<RefCell<T>>>
and code 2 that have to consume &T.

I have an issues with the following example playground.

```<code>use std::cell::RefCell;
use std::rc::Rc;

// Code 2
fn action(data_1: Option<&i32>, data_2: Option<&i32>) {
    println!("data_1:{:?}, data_2:{:?}", data_1, data_2);
}

fn main() {
    // Code 1
    let data_1 = Some(Rc::new(RefCell::new(2)));
    let data_2 = Some(Rc::new(RefCell::new(5)));

    let ref_data_1 = data_1.as_ref().map(|r| r.borrow());
    let ref_data_2 = data_2.as_ref().map(|r| r.borrow());

    action(ref_data_1, ref_data_2); // Error: mismatched types
}
</code>```

The example fail because of mismatch types between Ref<T> is found and &T is expected.
My only way that I have founded is to change Option<&i32> to Option<Ref<i32>> but that break the interface of code 2.

答:
You can change the action function to accept either Option<&i32> or Option<Ref<i32>> by using a generic argument with a Deref<Target = i32> bound, which both of those types satisfy:

```<code>use std::ops::Deref;

fn action<T>(data_1: Option<T>, data_2: Option<T>)
where
    T: Deref<Target = i32>,
{
    println!("data_1:{:?}, data_2:{:?}", data_1.as_deref(), data_2.as_deref());
}
</code>```

If you can't or don't want to change the signature of action, then you can call as_deref() on the arguments when you pass them in:

```<code>action(ref_data_1.as_deref(), ref_data_2.as_deref());
</code>```

ContentLicense: CC BY-SA 4.0

Body:
In the example we assume that we have two codes that has their perimeter and tested individually.

The code 1 return the type Option<Rc<RefCell<T>>>
and code 2 that have to consume &T.

I have an issues with the following example playground.

use std::cell::RefCell;
use std::rc::Rc;

// Code 2
fn action(data_1: Option<&i32>, data_2: Option<&i32>) {
    println!("data_1:{:?}, data_2:{:?}", data_1, data_2);
}

fn main() {
    // Code 1
    let data_1 = Some(Rc::new(RefCell::new(2)));
    let data_2 = Some(Rc::new(RefCell::new(5)));

    let ref_data_1 = data_1.as_ref().map(|r| r.borrow());
    let ref_data_2 = data_2.as_ref().map(|r| r.borrow());

    action(ref_data_1, ref_data_2); // Error: mismatched types
}

The example fail because of mismatch types between Ref<T> is found and &T is expected.
My only way that I have founded is to change Option<&i32> to Option<Ref<i32>> but that break the interface of code 2.

Body:
You can change the action function to accept either Option<&i32> or Option<Ref<i32>> by using a generic argument with a Deref<Target = i32> bound, which both of those types satisfy:

use std::ops::Deref;

fn action<T>(data_1: Option<T>, data_2: Option<T>)
where
    T: Deref<Target = i32>,
{
    println!("data_1:{:?}, data_2:{:?}", data_1.as_deref(), data_2.as_deref());
}

If you can't or don't want to change the signature of action, then you can call as_deref() on the arguments when you pass them in:

action(ref_data_1.as_deref(), ref_data_2.as_deref());


问:
Rails 3 Creating an Object in a Foreign Model
I have a Transaction object and want to:

Check if a Cart session exists.

If yes, associate the Transaction with that Cart's ID from the session.

If no, create a new Cart object and assign its ID to a session variable.

The relationship is:

```<code>Cart has_many Transactions
Transaction belongs_to Cart
</code>```

My question is: How do you / What is the best way to create a Cart object and associated session from within the Transaction controller?

I tried something like this in the Transaction new action:

```<code>@cart = Cart.new
</code>```

And, this in the Transaction create action:

```<code>@cart = Cart.new(params[:cart])
session[:cart] = @cart.id
</code>```

But, that doesn't create a session or Cart object. And, when searching Google I wasn't able to find documentation on this type of thing. Does anyone know how it is done properly?

答:
```<code>Cart.new
</code>```

... will only instantiate a new Cart but will not persist it into the database. The Cart object needs to be stored in the database if it is to be used across requests.

Use this to persist the Cart object:

```<code>Cart.create(params[:cart])
</code>```

or

```<code>@cart.save!
</code>```

For this:

```<code>session[:cart] = @cart.id
</code>```

... you've done the right thing by storing the ID in the session :) But note that you need to fetch this again on every request. So you could add a helper in your application_controller.rb with something like:

```<code>def current_cart
  Cart.find_by_id(session[:cart])
end
</code>```

.... which could return a nil cart.

ContentLicense: CC BY-SA 3.0

Body:
I have a Transaction object and want to:

Check if a Cart session exists.

If yes, associate the Transaction with that Cart's ID from the session.

If no, create a new Cart object and assign its ID to a session variable.

The relationship is:

Cart has_many Transactions
Transaction belongs_to Cart

My question is: How do you / What is the best way to create a Cart object and associated session from within the Transaction controller?

I tried something like this in the Transaction new action:

@cart = Cart.new

And, this in the Transaction create action:

@cart = Cart.new(params[:cart])
session[:cart] = @cart.id

But, that doesn't create a session or Cart object. And, when searching Google I wasn't able to find documentation on this type of thing. Does anyone know how it is done properly?

Body:
Cart.new

... will only instantiate a new Cart but will not persist it into the database. The Cart object needs to be stored in the database if it is to be used across requests.

Use this to persist the Cart object:

Cart.create(params[:cart])

or

@cart.save!

For this:

session[:cart] = @cart.id

... you've done the right thing by storing the ID in the session :) But note that you need to fetch this again on every request. So you could add a helper in your application_controller.rb with something like:

def current_cart
  Cart.find_by_id(session[:cart])
end

.... which could return a nil cart.


问:
Is there a way that a Party can be notified that a Flow has been completed?
Taking as an example the flow described in the Corda documentation (see here), how can Bob receive the notification that the transaction he just signed has been completed, without polling his own vault?
Does a specific callback exist?

I need that the CorDapp running on Bob node communicates to another system the status of the transaction in real-time

Thanks a lot

答:
Two ways you could achieve this:

1. Subscribe to update using Client

```<code>cordaRPCOPS.vaultTrack(<YourState>.class).getUpdates().subscribe( update -> {
            update.getProduced().forEach(stateAndRef -> {
                // Action to be Performed on State Update
            });
        });
</code>```

2. Subscribe to update using CordaService:

```<code>getServiceHub().getVaultService().trackBy(<YourState>.class).getUpdates().subscribe( update -> {
    update.getProduced().forEach(stateAndRef -> {
        // Action to be Performed on State Update
    });
});
</code>```

Body:
Two ways you could achieve this:

1. Subscribe to update using Client

cordaRPCOPS.vaultTrack(<YourState>.class).getUpdates().subscribe( update -> {
            update.getProduced().forEach(stateAndRef -> {
                // Action to be Performed on State Update
            });
        });

2. Subscribe to update using CordaService:

getServiceHub().getVaultService().trackBy(<YourState>.class).getUpdates().subscribe( update -> {
    update.getProduced().forEach(stateAndRef -> {
        // Action to be Performed on State Update
    });
});


问:
Logging and Debuging on Qubole
How does one log on Qubole/access logs from spark on Qubole? The setup I have:

java library (JAR)

Zeppelin Notebook (Scala), simply calling a method from the library

Spark, Yarn cluster

Log4j2 used in the library (configured to log on stdout)

How can I access my logs from the log4j2 logger? What I tried so far:

Looking into the 'Logs' section of my Interpreters

Going through Spark UI's stdout logs of each executor

答:
When a Spark job or application fails, you can use the Spark logs to analyze the failures.

The QDS UI provides links to the logs in the Application UI and Spark Application UI.

If you are running the Spark job or application from the Analyze page, you can access the logs via the Application UI and Spark Application UI.

If you are running the Spark job or application from the Notebooks page, you can access the logs via the Spark Application UI.

Accessing the Application UI Accessing the Spark Application UI You can also additional logs to identify the errors and exceptions in Spark job or application failures.

Accessing the Application UI
To access the logs via the Application UI from the Analyze page of the QDS UI:

Note the command id, which is unique to the Qubole job or command.
Click on the down arrow on the right of the search bar.
The Search History page appears as shown in the following figure.

../../_images/spark-debug1.png
Enter the command id in the Command Id field and click Apply.

Logs of any Spark job are displayed in Application UI and Spark Application UI, which are accessible in the Logs and Resources tabs. The information in these UIs can be used to trace any information related to command status.

The following figure shows an example of Logs tab with links.

Click on the Application UI hyperlink in the Logs tab or Resources tab.

The Hadoop MR application UI is displayed as shown in the following figure.

../../_images/application-ui.png
The Hadoop MR application UI displays the following information:

MR application master logs
Total Mapper/Reducer tasks
Completed/Failed/Killed/Successful tasks
Note

The MR application master logs corresponds to the Spark driver logs. For any Spark driver related issues, you should verify the AM logs (driver logs).

If you want to check the exceptions of the failed jobs, you can click on the logs link in the Hadoop MR application UI page. The Application Master (AM) logs page that contains stdout, stderr and syslog is displayed.

Accessing the Spark Application UI
You can access the logs by using the Spark Application UI from the Analyze page and Notebooks page.

From the Analyze page
From the Home menu, navigate to the Analyze page.
Note the command id, which is unique to the Qubole job or command.
Click on the down arrow on the right of the search bar. The Search History page appears as shown in the following figure.
../../_images/spark-debug1.png
Enter the command id in the Command Id field and click Apply.
Click on the Logs tab or Resources tab.
Click on the Spark Application UI hyperlink.
From the Notebooks page
From the Home menu, navigate to the Notebooks page.

Click on the Spark widget on the top right and click on Spark UI as shown in the following figure.

../../_images/spark-ui.png
OR

Click on the i icon in the paragraph as shown in the following figure.

../../_images/spark-debug2.png
When you open the Spark UI from the Spark widget of the Notebooks page or from the Analyze page, the Spark Application UI is displayed in a separate tab as shown in the following figure.

../../_images/spark-application-ui.png
The Spark Application UI displays the following information:

Jobs: The Jobs tab shows the total number of completed, succeeded and failed jobs. It also shows the number of stages that a job has succeeded.

Stages: The Stages tab shows the total number of completed and failed stages. If you want to check more details about the failed stages, click on the failed stage in the Description column. The details of the failed stages are displayed as shown in the following figure.

../../_images/spark-app-stage.png
The Errors column shows the detailed error message for the failed tasks. You should note the executor id and the hostname to view details in the container logs. For more details about the error stack trace, you should check the container logs.

Storage: The Storage tab displayed the cached data if caching is enabled.

Environment : The Environment tab shows the information about JVM, Spark properties, System properties and classpath entries which helps to know the values for a property that is used by the spark cluster during runtime. The following figure shows the Environment tab.

../../_images/spark-app-env.png
Executors : The Executors tab shows the container logs. You can map the container logs using the executor id and the hostname, which is displayed in the Stages tab.

Spark on Qubole provides the following additional fields in the Executors tab:

Resident size/Container size: Displays the total physical memory used within the container (which is the executor’s java heap + off heap memory) as Resident size, and the configured yarn container size (which is executor memory + executor overhead) as Container size.
Heap used/committed/max: Displays values corresponding to the executor’s java heap.
The following figure shows the Executors tab.

../../_images/spark-app-exec.png
The Logs column in shows the links to the container logs. Additionally, the number of tasks executed by each executor with number of active, failed, completed and total tasks are displayed.

Note

For debugging container memory issues, you can check the statistics on container size, Heap used, the input size, and shuffle read/write.

Feedback
Accessing Additional Spark Logs
Apart from accessing the logs from the QDS UI, you can also access the following logs, which reside on the cluster, to identify the errors and exceptions in Spark jobs failures:

and it contains the Spark event logs.
Spark History Server Logs: The spark-yarn-org.apache.spark.deploy.history.HistoryServer-1-localhost.localdomain.log
files are stored at /media/ephemeral0/logs/spark. The Spark history server logs are stored only on the master node of the cluster.

Spark Event Logs: The Spark eventlog files are stored at
/logs/hadoop///spark-eventlogs where:

scheme is the Cloud-specific URI scheme: s3:// for AWS; wasb:// or adl:// or abfs[s] for Azure; oci:// for Oracle OCI.
defloc is the default storage location for the QDS account.
cluster_id is the cluster ID as shown on the Clusters page of the QDS UI.
cluster_inst_id is the cluster instance ID. You should contact Qubole Support to obtain the cluster instance ID.

Title: Logging and Debuging on Qubole


问:
Is there a pandas functionality to get an None instead of an index error?
I have a pandas (version 0.25) DataFrame with some indexes. When I'm looking for an index not present in the DataFrame, I (of course) get an KeyError.

```<code>import pandas as pd
df = pd.DataFrame({'age': [50, 40]}, index = ['alice', 'bob'])
# works, returns age 50:
df.loc['alice']
# does not work, gives KeyError
</code>```

What I would like to have is something like get for dictionaries ({'alice': 50}.get('charlie')) for DataFrames. The best I could find was

```<code>df.loc['charlie'] if 'charlie' in df.index else None
</code>```

答:
You could use reindex:

```<code>df.reindex(['Charlie'])
</code>```

Output:

```<code>         age
Charlie  NaN
</code>```

Body:
I have a pandas (version 0.25) DataFrame with some indexes. When I'm looking for an index not present in the DataFrame, I (of course) get an KeyError.

import pandas as pd
df = pd.DataFrame({'age': [50, 40]}, index = ['alice', 'bob'])
# works, returns age 50:
df.loc['alice']
# does not work, gives KeyError

What I would like to have is something like get for dictionaries ({'alice': 50}.get('charlie')) for DataFrames. The best I could find was

df.loc['charlie'] if 'charlie' in df.index else None

Body:
You could use reindex:

df.reindex(['Charlie'])

Output:

         age
Charlie  NaN


问:
Python - Remove axis tick labels, keeping ticks and axis label
I would like to remove the numerical values in each thick of my y-axis (10, 20, 30, etc.) but keeping the thick marks and the axis label.
So far I just have:

```<code>yticks([])
</code>```

but it removes the ticks as well. I also tried:

```<code>frame=gca()
frame.axes.get_yaxis().set_visible(False)
</code>```

but it removes both axis label and axis ticks.

答:
I agree with Mathieu that tick_params() is a better method (because you don't need to know the number of ticks in advance), however the most generalized parameter is "label1On," i.e.:

gca().tick_params(axis='x',label1On=False)

This approach easily extends to 'y' axis, as well as the second 'x' or 'y' axes (using label2On).

Body:
I would like to remove the numerical values in each thick of my y-axis (10, 20, 30, etc.) but keeping the thick marks and the axis label.
So far I just have:

yticks([])

but it removes the ticks as well. I also tried:

frame=gca()
frame.axes.get_yaxis().set_visible(False)

but it removes both axis label and axis ticks.


问:
Check that WiFi is turned on in a React Native iOS app
Do you know how it is possible to check that WiFi is turned on in a React Native iOS app. Due to the aGPS on iOS devices, the WiFi must be turned on in order for our location sensitive app to be able to work effectively and we want to notify the user in cases it is turned off.

Any idea how to achieve this in a React Native app for iOS?

答:
i don't know exactly what are you going to do with WIFI information, but if you want simple information, I use react-native netinfo: https://github.com/react-native-community/react-native-netinfo#react-native-communitynetinfo
If you use Expo I recommended this one, network https://docs.expo.io/versions/latest/sdk/network/</p>


问:
Difference between CoroutineScope and coroutineScope in Kotlin
Can anyone give clarity between functions CoroutineScope() and coroutineScope()?

When I tried to check in source, I found that both of them are functions of CoroutineScope.kt.  Additionally, coroutineScope() is suspend function while other one is normal function

Below is documentation I could find :

```<code>/**
 * Creates a [CoroutineScope] that wraps the given coroutine [context].
 *
 * If the given [context] does not contain a [Job] element, then a default `Job()` is created.
 * This way, cancellation or failure or any child coroutine in this scope cancels all the other children,
 * just like inside [coroutineScope] block.
 */
@Suppress("FunctionName")
public fun CoroutineScope(context: CoroutineContext): CoroutineScope =
    ContextScope(if (context[Job] != null) context else context + Job())
</code>```

And

```<code>/**
 * Creates a [CoroutineScope] and calls the specified suspend block with this scope.
 * The provided scope inherits its [coroutineContext][CoroutineScope.coroutineContext] from the outer scope, but overrides
 * the context's [Job].
 *
 * This function is designed for _parallel decomposition_ of work. When any child coroutine in this scope fails,
 * this scope fails and all the rest of the children are cancelled (for a different behavior see [supervisorScope]).
 * This function returns as soon as the given block and all its children coroutines are completed.
 * A usage example of a scope looks like this:
 *
 * ```
 * suspend fun showSomeData() = coroutineScope {
 *
 *   val data = async(Dispatchers.IO) { // <- extension on current scope
 *      ... load some UI data for the Main thread ...
 *   }
 *
 *   withContext(Dispatchers.Main) {
 *     doSomeWork()
 *     val result = data.await()
 *     display(result)
 *   }
 * }
 * ```
 *
 * The scope in this example has the following semantics:
 * 1) `showSomeData` returns as soon as the data is loaded and displayed in the UI.
 * 2) If `doSomeWork` throws an exception, then the `async` task is cancelled and `showSomeData` rethrows that exception.
 * 3) If the outer scope of `showSomeData` is cancelled, both started `async` and `withContext` blocks are cancelled.
 * 4) If the `async` block fails, `withContext` will be cancelled.
 *
 * The method may throw a [CancellationException] if the current job was cancelled externally
 * or may throw a corresponding unhandled [Throwable] if there is any unhandled exception in this scope
 * (for example, from a crashed coroutine that was started with [launch][CoroutineScope.launch] in this scope).
 */
public suspend fun <R> coroutineScope(block: suspend CoroutineScope.() -> R): R =
    suspendCoroutineUninterceptedOrReturn { uCont ->
        val coroutine = ScopeCoroutine(uCont.context, uCont)
        coroutine.startUndispatchedOrReturn(coroutine, block)
    }
</code>```

I want to get clear difference between them. If anyone can answer when to use which one, it would be helpful.

答: In the Unstructured concurrency example if you replace Launch builder with Async and await on the deferred, it will work same as the example you have used in Structured Concurrency. Your answer is still unclear. Explain the actual use of structured concurrency (Which is useful in exception and error handling, when one of the child Job throws an exception, which should not effect other childrens(Jobs))</p>

Body:
Can anyone give clarity between functions CoroutineScope() and coroutineScope()?

When I tried to check in source, I found that both of them are functions of CoroutineScope.kt.  Additionally, coroutineScope() is suspend function while other one is normal function

Below is documentation I could find :

/**
 * Creates a [CoroutineScope] that wraps the given coroutine [context].
 *
 * If the given [context] does not contain a [Job] element, then a default `Job()` is created.
 * This way, cancellation or failure or any child coroutine in this scope cancels all the other children,
 * just like inside [coroutineScope] block.
 */
@Suppress("FunctionName")
public fun CoroutineScope(context: CoroutineContext): CoroutineScope =
    ContextScope(if (context[Job] != null) context else context + Job())

And

/**
 * Creates a [CoroutineScope] and calls the specified suspend block with this scope.
 * The provided scope inherits its [coroutineContext][CoroutineScope.coroutineContext] from the outer scope, but overrides
 * the context's [Job].
 *
 * This function is designed for _parallel decomposition_ of work. When any child coroutine in this scope fails,
 * this scope fails and all the rest of the children are cancelled (for a different behavior see [supervisorScope]).
 * This function returns as soon as the given block and all its children coroutines are completed.
 * A usage example of a scope looks like this:
 *
 * ```
 * suspend fun showSomeData() = coroutineScope {
 *
 *   val data = async(Dispatchers.IO) { // <- extension on current scope
 *      ... load some UI data for the Main thread ...
 *   }
 *
 *   withContext(Dispatchers.Main) {
 *     doSomeWork()
 *     val result = data.await()
 *     display(result)
 *   }
 * }
 * ```
 *
 * The scope in this example has the following semantics:
 * 1) `showSomeData` returns as soon as the data is loaded and displayed in the UI.
 * 2) If `doSomeWork` throws an exception, then the `async` task is cancelled and `showSomeData` rethrows that exception.
 * 3) If the outer scope of `showSomeData` is cancelled, both started `async` and `withContext` blocks are cancelled.
 * 4) If the `async` block fails, `withContext` will be cancelled.
 *
 * The method may throw a [CancellationException] if the current job was cancelled externally
 * or may throw a corresponding unhandled [Throwable] if there is any unhandled exception in this scope
 * (for example, from a crashed coroutine that was started with [launch][CoroutineScope.launch] in this scope).
 */
public suspend fun <R> coroutineScope(block: suspend CoroutineScope.() -> R): R =
    suspendCoroutineUninterceptedOrReturn { uCont ->
        val coroutine = ScopeCoroutine(uCont.context, uCont)
        coroutine.startUndispatchedOrReturn(coroutine, block)
    }

I want to get clear difference between them. If anyone can answer when to use which one, it would be helpful.


问:
How to get the root style declarations on the HTML document?
I have defined some styles in the :root and global namespace. But when I try to access them programmatically I am getting an error:

TypeError: Window.getComputedStyle: Argument 1 does not implement interface Element.

Here is my style rule:

```<code>:root {
    --my-css-variable: green;
}
</code>```

Here is what I have tried:

```<code>var variable = "--my-css-variable";

// all of the following error
window.getComputedStyle(window).getPropertyValue(variable);
window.getComputedStyle(window.document).getPropertyValue(variable);
window.getComputedStyle(window.document.body).getPropertyValue(variable);
</code>```

When I select an element on the page and look in debug tools it says element is inheriting from HTML:

答:
You could try:</p>

```<code>getComputedStyle(document.documentElement)
    .getPropertyValue('--my-css-variable');
</code>```

Body:
I have defined some styles in the :root and global namespace. But when I try to access them programmatically I am getting an error:

TypeError: Window.getComputedStyle: Argument 1 does not implement interface Element.

Here is my style rule:

:root {
    --my-css-variable: green;
}

Here is what I have tried:

var variable = "--my-css-variable";

// all of the following error
window.getComputedStyle(window).getPropertyValue(variable);
window.getComputedStyle(window.document).getPropertyValue(variable);
window.getComputedStyle(window.document.body).getPropertyValue(variable);

When I select an element on the page and look in debug tools it says element is inheriting from HTML:

Body:
You could try:

getComputedStyle(document.documentElement)
    .getPropertyValue('--my-css-variable');


问:
javascript equivalent of 'mouseleave' for touch interactions
Prelim caveat: I am very new to js and have mainly gotten by through doing web searches for examples/tutorials.

I am writing js which should run both on web and on mobile devices (e.g. iPad).

We have a library to help abstract away the differences between mouse and touch:

```<code>if (navigator.userAgent.search('Mobile') > 0) {
  window.FLAGS = {
    start: 'touchstart',
    end: 'touchend',
    move: 'touchmove',
    click: 'click',
    touchScreen: true
  };
} else {
  window.FLAGS = {
    start: 'mousedown',
    end: 'mouseup',
    move: 'mousemove',
    click: 'click',
    touchScreen: false
  };
}
</code>```

Then in code you can do things like:

```<code>widget.view.bind(FLAGS.start, function(e) {
</code>```

I am trying to find a touch equivalent for mouseleave so I can do a similar trick.

I can imagine ways to catch a leave event by tracking the position on move and comparing that to bounding box of widget in question, but I'm hoping there's a little one-liner like the touchstart/mousedown relationship.

答:
The whole idea about triggering touch leave is that we need to get the range of the element.

for example,
the box width range starts from 0 to actual width,
and the box height range starts from 0 to actual height

so if X, Y values are between this range then we are inside the box
and if other than that then we left the box.

check this snippet for better clarifying.

// select the box that we will leave
const box = document.getElementById('box');

// add touchmove event to the box
box.addEventListener('touchmove', (e) => {
    // stop default behavior
    e.stopPropagation();
    e.preventDefault();
    e = e || window.event;

    // get box properties
    let a = box.getBoundingClientRect();
    // get current width
    let w = a.width;
    // get current height
    let h = a.height;

    // get values on x axis
    const x = e.touches[0].pageX - a.left; // to start the value from 0 (remove offsetleft)
    // get values on y axis
    const y = e.touches[0].pageY - a.top; // to start the value from 0 (remove offsettop)

    //! INFO
    // the box width range starts from [0 : w]
    // the box height range starts from [0 : h]

    // if X values between [0 , w] and Y values between [0 , h] then we inside the box | other than that then we left the box
    if ((x >= 0 && x <= w) && (y >= 0 && y <= h)) {
        console.log('in the box');
    } else {
        console.log('left the box');
    }

});```
<pre class="snippet-code-css lang-css prettyprint-override"><code>#box {
    width: 280px;
    height: 280px;
    outline: 1px solid red;
    margin: 100px auto;
}</code>```

```

Body:
Prelim caveat: I am very new to js and have mainly gotten by through doing web searches for examples/tutorials.

I am writing js which should run both on web and on mobile devices (e.g. iPad).

We have a library to help abstract away the differences between mouse and touch:

if (navigator.userAgent.search('Mobile') > 0) {
  window.FLAGS = {
    start: 'touchstart',
    end: 'touchend',
    move: 'touchmove',
    click: 'click',
    touchScreen: true
  };
} else {
  window.FLAGS = {
    start: 'mousedown',
    end: 'mouseup',
    move: 'mousemove',
    click: 'click',
    touchScreen: false
  };
}

Then in code you can do things like:

widget.view.bind(FLAGS.start, function(e) {

I am trying to find a touch equivalent for mouseleave so I can do a similar trick.

I can imagine ways to catch a leave event by tracking the position on move and comparing that to bounding box of widget in question, but I'm hoping there's a little one-liner like the touchstart/mousedown relationship.

Body:
The whole idea about triggering touch leave is that we need to get the range of the element.

for example,
the box width range starts from 0 to actual width,
and the box height range starts from 0 to actual height

so if X, Y values are between this range then we are inside the box
and if other than that then we left the box.

check this snippet for better clarifying.

// select the box that we will leave
const box = document.getElementById('box');

// add touchmove event to the box
box.addEventListener('touchmove', (e) => {
    // stop default behavior
    e.stopPropagation();
    e.preventDefault();
    e = e || window.event;

    // get box properties
    let a = box.getBoundingClientRect();
    // get current width
    let w = a.width;
    // get current height
    let h = a.height;

    // get values on x axis
    const x = e.touches[0].pageX - a.left; // to start the value from 0 (remove offsetleft)
    // get values on y axis
    const y = e.touches[0].pageY - a.top; // to start the value from 0 (remove offsettop)

    //! INFO
    // the box width range starts from [0 : w]
    // the box height range starts from [0 : h]

    // if X values between [0 , w] and Y values between [0 , h] then we inside the box | other than that then we left the box
    if ((x >= 0 && x <= w) && (y >= 0 && y <= h)) {
        console.log('in the box');
    } else {
        console.log('left the box');
    }

});

#box {
    width: 280px;
    height: 280px;
    outline: 1px solid red;
    margin: 100px auto;
}

<div id="box"></div>


问:
On Swipe up Volume Is increasing but do not increase continious if i move finger up
Actually i want to increase/decrease volume continuously, when i swipe finger up/down .I want when i move finger up slowly then volume increase with finger movement and decrease in finger down case.
But my code increase volume when i swipe finger up only once. I need to again swipe up to increase more volume. Its not continuing increase as finger moves.

Please help me how i can do that. please check my code what is mistake. Please help thanks.

OnSwipeTouchListener.java (Class)

```<code>public class OnSwipeTouchListener implements OnTouchListener {

private final GestureDetector gestureDetector;

public OnSwipeTouchListener (Context ctx){
    gestureDetector = new GestureDetector(ctx, new GestureListener());
}

@Override
public boolean onTouch(View v, MotionEvent event) {
    return gestureDetector.onTouchEvent(event);
}

private final class GestureListener extends SimpleOnGestureListener {

    private static final int SWIPE_THRESHOLD = 100;
    private static final int SWIPE_VELOCITY_THRESHOLD = 100;

    @Override
    public boolean onDown(MotionEvent e) {
        return true;
    }

    @Override
    public boolean onScroll(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
        boolean result = false;
        try {
            float diffY = e2.getY() - e1.getY();
            float diffX = e2.getX() - e1.getX();
            if (Math.abs(diffX) > Math.abs(diffY)) {
                if (Math.abs(diffX) > SWIPE_THRESHOLD && Math.abs(velocityX) > SWIPE_VELOCITY_THRESHOLD) {
                    if (diffX > 0) {
                        onSwipeRight();
                    } else {
                        onSwipeLeft();
                    }
                    result = true;
                }
            }
            else if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
                if (diffY > 0) {
                    onSwipeBottom();
                } else {
                    onSwipeTop();
                }
                result = true;
            }
        } catch (Exception exception) {
            exception.printStackTrace();
        }
        return result;
    }

}

public void onSwipeRight() {
}

public void onSwipeLeft() {
}

public void onSwipeTop() {
}

public void onSwipeBottom() {
}
</code>```

}

VideoView.java (Activity)

```<code> fullview = (View)findViewById(R.id.fullView);
        fullview.setOnTouchListener(new OnSwipeTouchListener(ViewVideo.this) {
            public void onSwipeTop() {
                Toast.makeText(ViewVideo.this, "top", Toast.LENGTH_SHORT).show();
                currentVolume = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);
                audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, currentVolume + 1, 0);
            }
            public void onSwipeRight() {
                Toast.makeText(ViewVideo.this, "right", Toast.LENGTH_SHORT).show();
            }
            public void onSwipeLeft() {
                Toast.makeText(ViewVideo.this, "left", Toast.LENGTH_SHORT).show();
            }
            public void onSwipeBottom() {
                Toast.makeText(ViewVideo.this, "bottom", Toast.LENGTH_SHORT).show();
                currentVolume = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);
                audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, currentVolume - 1, 0);
            }

        });
</code>```

答:
What you need to implement is weighted thresholds. i.e. Currently you trigger the swipeUp volume by 1 whenever you detect that user is swiping up. What you are interested in is a bit more detailed, you would like to increase the volume more based on how much (i.e. theweight) the user has swiped up.

The code is good thus far and a few modifications can be used to achieve this. Notably:

in your onScroll or in a a helper method to determine how much/weight that the user has swiped up by and not just whether they have passed the threshold

Pass this weight to the overridden methods onSwipeTop() who must then use this value along with the maximum value from the AudioManager see official android docs to adjust the volume (i.e. you may be doing +1, +2 etc)

The api docs does document how to incorporate flags with setStreamVolume. I see that you are always using 0 which is equivalent to ADJUST_SAME . You may consider incorporating ADJUST_RAISE and ADJUST_LOWER respectively.

```<code>audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, currentVolume - 1, 0);
</code>```

Determining the "weight" (how much to adjust volume by)

You could use several approaches to determine the weighting. These examples assume that you previously define SWIPE_VERTICAL_INCREMENT as the integer increment value to adjust your weighting by. This value can be present by you to small integers or you may opt to determine it based on the screen size of the device (good for rotational experiences read more...).

Approach 1

One approach is after you've detected that they have passed the SWIPE_THRESHOLD you could use the difference between the threshold and how much they have scrolled to determine the weight.

```<code>if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
               int swipeVerticalWeighting = (int)((Math.abs(diffY) - SWIPE_THRESHOLD) / SWIPE_VERTICAL_INCREMENT);
                if (diffY > 0) {
                    onSwipeBottom(swipeVerticalWeighting );
                } else {
                    onSwipeTop(swipeVerticalWeighting );
                }
                result = true;
}
</code>```

Approach 2

Another approach is after you've detected that they have passed the SWIPE_THRESHOLD you could use the difference between how much they have scrolled to determine the weight.

```<code>if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
               int swipeVerticalWeighting = (int)(Math.abs(diffY) / SWIPE_VERTICAL_INCREMENT);
                if (diffY > 0) {
                    onSwipeBottom(swipeVerticalWeighting );
                } else {
                    onSwipeTop(swipeVerticalWeighting );
                }
                result = true;
}
</code>```

Changing the volume based on previously calculated weight

NB. You would have to update the signatures and overrides for onSwipeBottom and onSwipeTop to accommodate this .

Finally you can adjust the volume based on weighting.  Based on volume change there may be SecurityException or others and the "safe max volume " which prohibits some apps from exceeding a volume threshold without the user permission should be taken into consideration (this is configurable also).

```<code>public void onSwipeTop(int increaseVolumeBy) {
                Toast.makeText(ViewVideo.this, "top", Toast.LENGTH_SHORT).show();
                currentVolume = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);
                //feel free to retrieve the max volume elsewhere, it should not change frequently
               int maxVolume = audioManager.getStreamMaxVolume(AudioManager.STREAM_MUSIC);
//ensure volume being increased by is not more than the max volume
              int nextVolume = currentVolume + increaseVolumeBy;
              if(nextVolume > maxVolume){

                 nextVolume = maxVolume;

              }
                audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, nextVolume, AudioManager.ADJUST_RAISE);
}
</code>```

Overall you need to decide how much you would like volume to be increased by based on how you swipe up and how much weighting that should be given. This can vary based on the type of app your delivering and your expected user based.

Body:
Actually i want to increase/decrease volume continuously, when i swipe finger up/down .I want when i move finger up slowly then volume increase with finger movement and decrease in finger down case.
But my code increase volume when i swipe finger up only once. I need to again swipe up to increase more volume. Its not continuing increase as finger moves.

Please help me how i can do that. please check my code what is mistake. Please help thanks.

OnSwipeTouchListener.java (Class)

public class OnSwipeTouchListener implements OnTouchListener {

private final GestureDetector gestureDetector;

public OnSwipeTouchListener (Context ctx){
    gestureDetector = new GestureDetector(ctx, new GestureListener());
}

@Override
public boolean onTouch(View v, MotionEvent event) {
    return gestureDetector.onTouchEvent(event);
}

private final class GestureListener extends SimpleOnGestureListener {

    private static final int SWIPE_THRESHOLD = 100;
    private static final int SWIPE_VELOCITY_THRESHOLD = 100;

    @Override
    public boolean onDown(MotionEvent e) {
        return true;
    }

    @Override
    public boolean onScroll(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY) {
        boolean result = false;
        try {
            float diffY = e2.getY() - e1.getY();
            float diffX = e2.getX() - e1.getX();
            if (Math.abs(diffX) > Math.abs(diffY)) {
                if (Math.abs(diffX) > SWIPE_THRESHOLD && Math.abs(velocityX) > SWIPE_VELOCITY_THRESHOLD) {
                    if (diffX > 0) {
                        onSwipeRight();
                    } else {
                        onSwipeLeft();
                    }
                    result = true;
                }
            }
            else if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
                if (diffY > 0) {
                    onSwipeBottom();
                } else {
                    onSwipeTop();
                }
                result = true;
            }
        } catch (Exception exception) {
            exception.printStackTrace();
        }
        return result;
    }

}

public void onSwipeRight() {
}

public void onSwipeLeft() {
}

public void onSwipeTop() {
}

public void onSwipeBottom() {
}

}

VideoView.java (Activity)

 fullview = (View)findViewById(R.id.fullView);
        fullview.setOnTouchListener(new OnSwipeTouchListener(ViewVideo.this) {
            public void onSwipeTop() {
                Toast.makeText(ViewVideo.this, "top", Toast.LENGTH_SHORT).show();
                currentVolume = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);
                audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, currentVolume + 1, 0);
            }
            public void onSwipeRight() {
                Toast.makeText(ViewVideo.this, "right", Toast.LENGTH_SHORT).show();
            }
            public void onSwipeLeft() {
                Toast.makeText(ViewVideo.this, "left", Toast.LENGTH_SHORT).show();
            }
            public void onSwipeBottom() {
                Toast.makeText(ViewVideo.this, "bottom", Toast.LENGTH_SHORT).show();
                currentVolume = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);
                audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, currentVolume - 1, 0);
            }

        });

Body:
What you need to implement is weighted thresholds. i.e. Currently you trigger the swipeUp volume by 1 whenever you detect that user is swiping up. What you are interested in is a bit more detailed, you would like to increase the volume more based on how much (i.e. theweight) the user has swiped up.

The code is good thus far and a few modifications can be used to achieve this. Notably:

in your onScroll or in a a helper method to determine how much/weight that the user has swiped up by and not just whether they have passed the threshold

Pass this weight to the overridden methods onSwipeTop() who must then use this value along with the maximum value from the AudioManager see official android docs to adjust the volume (i.e. you may be doing +1, +2 etc)

The api docs does document how to incorporate flags with setStreamVolume. I see that you are always using 0 which is equivalent to ADJUST_SAME . You may consider incorporating ADJUST_RAISE and ADJUST_LOWER respectively.

audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, currentVolume - 1, 0);

Determining the "weight" (how much to adjust volume by)

You could use several approaches to determine the weighting. These examples assume that you previously define SWIPE_VERTICAL_INCREMENT as the integer increment value to adjust your weighting by. This value can be present by you to small integers or you may opt to determine it based on the screen size of the device (good for rotational experiences read more...).

Approach 1

One approach is after you've detected that they have passed the SWIPE_THRESHOLD you could use the difference between the threshold and how much they have scrolled to determine the weight.

if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
               int swipeVerticalWeighting = (int)((Math.abs(diffY) - SWIPE_THRESHOLD) / SWIPE_VERTICAL_INCREMENT);
                if (diffY > 0) {
                    onSwipeBottom(swipeVerticalWeighting );
                } else {
                    onSwipeTop(swipeVerticalWeighting );
                }
                result = true;
}

Approach 2

Another approach is after you've detected that they have passed the SWIPE_THRESHOLD you could use the difference between how much they have scrolled to determine the weight.

if (Math.abs(diffY) > SWIPE_THRESHOLD && Math.abs(velocityY) > SWIPE_VELOCITY_THRESHOLD) {
               int swipeVerticalWeighting = (int)(Math.abs(diffY) / SWIPE_VERTICAL_INCREMENT);
                if (diffY > 0) {
                    onSwipeBottom(swipeVerticalWeighting );
                } else {
                    onSwipeTop(swipeVerticalWeighting );
                }
                result = true;
}

Changing the volume based on previously calculated weight

NB. You would have to update the signatures and overrides for onSwipeBottom and onSwipeTop to accommodate this .

Finally you can adjust the volume based on weighting.  Based on volume change there may be SecurityException or others and the "safe max volume " which prohibits some apps from exceeding a volume threshold without the user permission should be taken into consideration (this is configurable also).

public void onSwipeTop(int increaseVolumeBy) {
                Toast.makeText(ViewVideo.this, "top", Toast.LENGTH_SHORT).show();
                currentVolume = audioManager.getStreamVolume(AudioManager.STREAM_MUSIC);
                //feel free to retrieve the max volume elsewhere, it should not change frequently
               int maxVolume = audioManager.getStreamMaxVolume(AudioManager.STREAM_MUSIC);
//ensure volume being increased by is not more than the max volume
              int nextVolume = currentVolume + increaseVolumeBy;
              if(nextVolume > maxVolume){

                 nextVolume = maxVolume;

              }
                audioManager.setStreamVolume(AudioManager.STREAM_MUSIC, nextVolume, AudioManager.ADJUST_RAISE);
}

Overall you need to decide how much you would like volume to be increased by based on how you swipe up and how much weighting that should be given. This can vary based on the type of app your delivering and your expected user based.


问:
Regex to replace %variables%
I've been yanking clumps of hair out for 30 minutes doing this one...

I have a dictionary, like so:

```<code>{'search': 'replace',
 'foo':    'bar'}
</code>```

And a string like this:

```<code>Foo bar %foo% % search %.
</code>```

I'd like to replace each variable with it's equivalent text from the dictionary:

```<code>Foo bar bar replace.
</code>```

My current regex fails, so here it is (key and value are from dictionary.items()):

```<code> re.sub(r'%\d+' + key + '[^%]\d+%', value, text)
</code>```

Any help would be appreciated, as this regex stuff is driving me nuts...

答:
Maybe I'm missing something, but wouldn't the following regex just work?

```<code>re.sub(r'%\s?' + key + '\s?%', value, text)
</code>```

The only thing that's a bit special are the optional spaces; they can be matched with \s?.

Title: Regex to replace %variables%

Body:
I've been yanking clumps of hair out for 30 minutes doing this one...

I have a dictionary, like so:

{'search': 'replace',
 'foo':    'bar'}

And a string like this:

Foo bar %foo% % search %.

I'd like to replace each variable with it's equivalent text from the dictionary:

Foo bar bar replace.

My current regex fails, so here it is (key and value are from dictionary.items()):

 re.sub(r'%\d+' + key + '[^%]\d+%', value, text)

Any help would be appreciated, as this regex stuff is driving me nuts...

Body:
Maybe I'm missing something, but wouldn't the following regex just work?

re.sub(r'%\s?' + key + '\s?%', value, text)

The only thing that's a bit special are the optional spaces; they can be matched with \s?.


问:
In Bootstrap, how do I change what color the links are in my navbar when hovering over them?
Please help, it's driving me crazy (it's insane that I have spent so much time on the navbar text color overall).

I'm just learning web development so I just figured out how to change the text color in my navbar and now it turns an ugly blue when I hover over it. How do I figure out how to fix that?

I know others have asked this before but they all get specific answers that don't apply to my code and I don't understand why the solutions work, so I could figure it out by myself.

Thanks for your help!

```<code> <!--Navbar-->
    <nav class="navbar navbar-expand-lg yellow lighten-3 fixed-top scrolling-navbar">
        <div class="container">
            <!--center the navbar content-->
            <!-- Navbar brand -->
            <a class="navbar-brand navbar-text-color-custom" href="#">Pawsitive Lead</a>

            <!-- Collapse button -->
            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#basicExampleNav"
                    aria-controls="basicExampleNav" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
            </button>

            <!-- Collapsible content -->
            <div class="collapse navbar-collapse" id="basicExampleNav">

                <!-- Links - each sends you to the specific section of the page -->
                <ul class="navbar-nav mr-auto smooth-scroll">
                    <li class="nav-item">
                        <a class="nav-link navbar-text-color-custom" href="#intro">Blog</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link navbar-text-color-custom" href="#best-features">Kdo smo?</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link navbar-text-color-custom" href="#examples">Izkušnje</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link navbar-text-color-custom" href="#gallery">V razmislek</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link navbar-text-color-custom" href="#contact">Pišite nam</a>
                    </li>
                </ul>
                <!-- Links -->

                <form class="form-inline">
                    <div class="md-form my-0">
                        <input class="form-control mr-sm-2" type="text" placeholder="Išči" aria-label="Search">
                    </div>
                </form>
            </div>
            <!-- Collapsible content -->

        </div>
    </nav>
    <!--/.Navbar-->
</code>```

答:
You can approach it by different ways ..

define a separate class in a separate css stylesheet and override the color by using !important :

e.g : make a class newClass in newCss.css

```<code>.newClass:hover{
   color: red !important; /*red is an example, put whatever you want*/
}
</code>```

define a style tag in the html :

```<code><style>
.newClass:hover{
   color: red !important; /*red is an example, put whatever you want*/
}

</style>
</code>```

in HTML , put the class inside the anchor:

```<code> <li class="nav-item">
 <a class=" newClass nav-link navbar-text-color-custom" href="#best-features">Kdo smo?</a></li>
</code>```

By using !important you ensure that the css color red is applied to the anchor.

Body:
Please help, it's driving me crazy (it's insane that I have spent so much time on the navbar text color overall).

I'm just learning web development so I just figured out how to change the text color in my navbar and now it turns an ugly blue when I hover over it. How do I figure out how to fix that?

I know others have asked this before but they all get specific answers that don't apply to my code and I don't understand why the solutions work, so I could figure it out by myself.

Thanks for your help!

            Pawsitive Lead

            <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#basicExampleNav"
                    aria-controls="basicExampleNav" aria-expanded="false" aria-label="Toggle navigation">

            </button>

                        Blog

                        Kdo smo?

                        Izkušnje

                        V razmislek

                        Pišite nam

                <form class="form-inline">

                        <input class="form-control mr-sm-2" type="text" placeholder="Išči" aria-label="Search">

                </form>

Body:
You can approach it by different ways ..

define a separate class in a separate css stylesheet and override the color by using !important :

e.g : make a class newClass in newCss.css

.newClass:hover{
   color: red !important; /*red is an example, put whatever you want*/
}

define a style tag in the html :

<style>
.newClass:hover{
   color: red !important; /*red is an example, put whatever you want*/
}

</style>

in HTML , put the class inside the anchor:

 <li class="nav-item">
 <a class=" newClass nav-link navbar-text-color-custom" href="#best-features">Kdo smo?</a></li>

By using !important you ensure that the css color red is applied to the anchor.


问:
Conditional group by with window function in Snowflake query
I have a table in Snowflake in following format:

```<code>create temp_test(name string, split string, value int)

insert into temp_test
values ('A','a', 100), ('A','b', 200), ('A','c',300), ('A', 'd', 400), ('A', 'e',500), ('B', 'a', 1000), ('B','b', 2000), ('B','c', 3000), ('B', 'd',4000), ('B','e', 5000)

</code>```

First step, I needed only top 2 value per name (sorted on value), so I used following query to get that:

```<code>select name, split, value,
row_number() over (PARTITION BY (name) order by value desc) as row_num
from temp_test
qualify row_num <= 2
</code>```

Which gives me following resultset:

```<code>NAME    SPLIT   VALUE   ROW_NUM
A       e       500     1
A       d       400     2
B       e       5000    1
B       d       4000    2
</code>```

Now, I need to sum values other than Top 2 and put it in a different Split named as "Others", like this:

```<code>NAME    SPLIT   VALUE
A       e       500
A       d       400
A       Others  600
B       e       5000
B       d       4000
B       Others  6000
</code>```

How to do that in Snowflake query or SQL in general?

答:
```<code>with data as (
    select name, split, value,
        row_number() over (partition by (name) order by value desc) as row_num
    from temp_test
)
select
    name,
    case when row_num <= 2 then split else 'Others' end as split,
    sum(value) as value
from data
group by name, case when row_num <= 2 then row_num else 3 end
</code>```

Body:
I have a table in Snowflake in following format:

create temp_test(name string, split string, value int)

insert into temp_test
values ('A','a', 100), ('A','b', 200), ('A','c',300), ('A', 'd', 400), ('A', 'e',500), ('B', 'a', 1000), ('B','b', 2000), ('B','c', 3000), ('B', 'd',4000), ('B','e', 5000)

First step, I needed only top 2 value per name (sorted on value), so I used following query to get that:

select name, split, value,
row_number() over (PARTITION BY (name) order by value desc) as row_num
from temp_test
qualify row_num <= 2

Which gives me following resultset:

NAME    SPLIT   VALUE   ROW_NUM
A       e       500     1
A       d       400     2
B       e       5000    1
B       d       4000    2

Now, I need to sum values other than Top 2 and put it in a different Split named as "Others", like this:

NAME    SPLIT   VALUE
A       e       500
A       d       400
A       Others  600
B       e       5000
B       d       4000
B       Others  6000

How to do that in Snowflake query or SQL in general?


问:
Can't resolve '@material-ui/core/TableContainer
I want to import table container for my react application. but I can't use it because of my material ui version error.
How i update my version to latest version. I suppose that it's the solution for that error.
I have already tried npm uninstall and npm uninstall, but didn't solve yet. Help me.</p>

```<code>{
  "name": "material-dashboard-react",
  "version": "1.6.0",
  "description": "Material Dashboard React. Coded by Creative Tim",
  "private": false,
  "main": "dist/index.js",
  "dependencies": {
    "@khanacademy/react-multi-select": "^0.3.3",
    "@lls/react-light-calendar": "^2.0.7",
    "@material-ui/core": "^3.9.4",
    "@material-ui/icons": "3.0.2",
    "@progress/kendo-react-dropdowns": "^3.4.1",
    "@progress/kendo-react-intl": "^3.4.1",
    "animate.css": "^3.7.2",
    "axios": "^0.19.1",
    "bootstrap": "^4.3.1",
    "chartist": "0.10.1",
    "classnames": "2.2.6",
    "firebase": "^7.0.0",
    "history": "4.7.2",
    "jquery": "^1.9.1",
    "material-ui-next-responsive-table": "^0.5.1",
    "multi-select-react": "^0.1.8",
    "multiselect-dropdown-react": "^1.0.5",
    "multiselect-react-dropdown": "^1.2.4",
    "perfect-scrollbar": "1.4.0",
    "prettier": "1.16.4",
    "prop-types": "15.7.1",
    "react": "^16.8.1",
    "react-bootstrap": "^1.0.0-beta.12",
    "react-bootstrap-dialog": "^0.13.0",
    "react-bootstrap-modal": "^4.2.0",
    "react-chartist": "0.13.3",
    "react-confirm-alert": "^2.4.1",
    "react-datepicker": "^2.9.6",
    "react-devtools": "^4.4.0",
    "react-dialog": "^1.0.2",
    "react-dom": "16.8.1",
    "react-dropdown": "^1.6.4",
    "react-dropdown-multiselect": "^1.0.0",
    "react-dropdown-tree-select": "^2.1.1",
    "react-google-maps": "9.4.5",
    "react-light-calendar": "^1.0.3",
    "react-multiple-select-dropdown": "^2.0.0",
    "react-multiselect-checkboxes": "^0.1.1",
    "react-notification-alert": "0.0.12",
    "react-notifications": "^1.4.3",
    "react-notifications-component": "^2.1.0",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.5",
    "react-select": "^3.0.8",
    "react-swipeable-views": "0.13.1",
    "react-table-container": "^2.0.3",
    "react-toastify": "^5.4.0",
</code>```

答:
1) Go to package.json file in your project root.

2) Locate @material-ui/core in dependencies. Currently, you will see it as "@material-ui/core": "^3.9.4".

3) Now edit the version number. For example, "@material-ui/core": "^4.9.2".

4) Run npm install.

That's it!

You can follow this procedure for any dependency when you want to change the version. But make sure that those versions are compatible with each other dependencies (if any).

Good luck!

Body:
I want to import table container for my react application. but I can't use it because of my material ui version error.
How i update my version to latest version. I suppose that it's the solution for that error.
I have already tried npm uninstall and npm uninstall, but didn't solve yet. Help me.

{
  "name": "material-dashboard-react",
  "version": "1.6.0",
  "description": "Material Dashboard React. Coded by Creative Tim",
  "private": false,
  "main": "dist/index.js",
  "dependencies": {
    "@khanacademy/react-multi-select": "^0.3.3",
    "@lls/react-light-calendar": "^2.0.7",
    "@material-ui/core": "^3.9.4",
    "@material-ui/icons": "3.0.2",
    "@progress/kendo-react-dropdowns": "^3.4.1",
    "@progress/kendo-react-intl": "^3.4.1",
    "animate.css": "^3.7.2",
    "axios": "^0.19.1",
    "bootstrap": "^4.3.1",
    "chartist": "0.10.1",
    "classnames": "2.2.6",
    "firebase": "^7.0.0",
    "history": "4.7.2",
    "jquery": "^1.9.1",
    "material-ui-next-responsive-table": "^0.5.1",
    "multi-select-react": "^0.1.8",
    "multiselect-dropdown-react": "^1.0.5",
    "multiselect-react-dropdown": "^1.2.4",
    "perfect-scrollbar": "1.4.0",
    "prettier": "1.16.4",
    "prop-types": "15.7.1",
    "react": "^16.8.1",
    "react-bootstrap": "^1.0.0-beta.12",
    "react-bootstrap-dialog": "^0.13.0",
    "react-bootstrap-modal": "^4.2.0",
    "react-chartist": "0.13.3",
    "react-confirm-alert": "^2.4.1",
    "react-datepicker": "^2.9.6",
    "react-devtools": "^4.4.0",
    "react-dialog": "^1.0.2",
    "react-dom": "16.8.1",
    "react-dropdown": "^1.6.4",
    "react-dropdown-multiselect": "^1.0.0",
    "react-dropdown-tree-select": "^2.1.1",
    "react-google-maps": "9.4.5",
    "react-light-calendar": "^1.0.3",
    "react-multiple-select-dropdown": "^2.0.0",
    "react-multiselect-checkboxes": "^0.1.1",
    "react-notification-alert": "0.0.12",
    "react-notifications": "^1.4.3",
    "react-notifications-component": "^2.1.0",
    "react-router-dom": "^4.3.1",
    "react-scripts": "2.1.5",
    "react-select": "^3.0.8",
    "react-swipeable-views": "0.13.1",
    "react-table-container": "^2.0.3",
    "react-toastify": "^5.4.0",