I am trying to install https://github.com/SteveDunlap13/MaterialTimeControl under Angular 6. The installation succeeds without errors but I still cannot import the MaterialTimeControlModule.
All I can see is in my node_modules/ this is the only directory which is not marked as "orange" so I guess that means there's something wrong?
What am I missing here or could this be due to my recent update from Angular 5 to Angular 6?
As you write in comments under your question:
I am following this stackblitz example. I add it to my imports in my
app.module.ts
As you can see, in that example,in app.module.ts there is import MaterialTimeControlModule from.... SRC directory (not node_modules) !
This mean that you should create similar materia-time-control.module.ts file in your SRC directory and import it in app.module.ts in similar way. You probably should also create similar src/time-control directory (may be with som local changes depend on your particular project).
Related
I am trying to add a paintworklet to my application, but I am having a really hard time.
The worklet is a npm dependency, but worklets can't be inlined, they need to be registered like so:
CSS.paintWorklet.addModule('url/to/module.js');
I am having a hard time, because even though that currently works in my application, I am not sure if this is the right way to go about it, or if it will work in production. Currently, my url points to a file inside node_modules and I am not sure if nuxt will do anything with this.
I am currently doing this with a .client.js file inside the plugins folder. But they need an export default function(), but the worklet code does not have an export.
What I am currently trying to do, is tell nuxt somehow to grab certain files from node_modules and serve them as assets somehow, and then reference them some other way. But I cannot find any resources on this.
Any ideas would be appreciated.
If the file path is specified in a literal string, containing node_modules, the paint worklet might appear to work in development mode, but the worklet file will not be bundled in the build output:
CSS.paintWorklet.addModule('./node_modules/extra-scalloped-border/worklet.js')
^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^
❌ file not bundled in build output
Solution: Import the file
Importing a file enables the bundler to track the file, and include it in the build output. Nuxt 3 uses Vite by default, and the Vite docs describe how to import the file to use with paint worklets:
Explicit URL Imports
Assets that are not included in the internal list or in assetsInclude, can be explicitly imported as an URL using the ?url suffix. This is useful, for example, to import Houdini Paint Worklets.
import workletURL from 'extra-scalloped-border/worklet.js?url'
CSS.paintWorklet.addModule(workletURL)
Since the CSS.paintWorklet API is only available in the browser, make sure to use this in the mounted() hook, which only occurs client-side:
import workletURL from 'extra-scalloped-border/worklet.js?url'
export default {
mounted() {
CSS.paintWorklet.addModule(workletURL)
}
}
demo
I’ve a NuxtJS app and want to include a file called app.js (located in assets/js/app.js).
Contents of that file:
// imports from node_modules
import 'focus-visible';
import 'other-package';
…
What I am doing at the moment is to import that packages inside layouts/default.vue … but it doesn’t feel right.
How would you do it?
Importing the assets file is no different than importing any other JavaScript file from another src directory:
import '#/assets/js/app'
It's hard to say whether this usage is "right" without more context, but I don't see anything wrong with doing that.
I'm trying to do platform specific imports as I add support for web app as well. But I keep running into an import error for "ActionSheetIOS". I don't use this anywhere in my code, but this is a dependency for some number of my packages (react-native-map-link, react-native-share, etc). I've read that having .native.js and .js files for the package would fix an issue like this. How can I change this dependency and have my other packages installed by npm read from these edited files? Is there another easier fix to this?
Edit: This is the specific error I am getting if it helps.
./node_modules/react-native-map-link/src/utils.js
Attempted import error: 'ActionSheetIOS' is not exported from 'react-native'.
I've tried wrapping the code in the main files in Platform.OS selectors, so that's not the fix.
You can create specific js file like YourComponent.ios.js and YourComponent.android.js.
then import "ActionSheetIOS" in YourComponent.ios.js file. Also check this.
This is kind of embarassing because of how simple and common this problem is but I feel I've checked everything.
WSGI file is located at: /var/www/igfakes/server.wsgi
Apache is complaining that I can't import the module of my project, so I decided to start up a Python shell and see if it's any different - nope.
All the proof is in the following screenshot, I'll walk you through it.
First, see I cannot import my project
Then I import sys and check the path
Note /var/www in the path
Leave python
Check the directory, then confirm my project is in that same directory
My project is exactly where I'm specifying. Any idea what's going on?
I've followed a few different tutorials, all with the same instructions, like this one.
Let’s say we have a package named “mypackage” that we own. We also use this package in another project: “my-client”. Once installed, “my-package” is saved inside the node_modules directory of “my-client”.
There’s a specific file inside this “my-package” that I want to import in “my-client”. Let’s say the path to this file is: “node_modules/mypackage/dist/components/my-component.js”
I know that I can import this file as follows:
import myComponent from ‘mypackage/dist/components/my-component’
However, for a better dev experience, I want to be able to just say:
import myComponent from ‘mypackage/my-component’
I feel like this could be achieved by some package.json magic inside “my-package” but I can’t figure out how to do it.
Things I tried:
Setting the “main” key to “dist/components/index.js”
Setting the “module” key to “dist/components/index.js”