I am trying to import 'angular-ui-bootstrap' in the vendor.ts file.
I keep getting can not resolve angular-ui-bootstrap.
Any suggestions on how to get around this problem.
I want to remove the reference from my index.html and move it to the Vendor.ts file which webpack uses to bundle vendor files.
Thanks
Related
I've wanted to add Expo in my React Native project to start it in a web browser. After doing that, I try to import file 'assets/styles/constants.ts'. This is my tsconfig.json:
tsconfig.json
This is constants.ts:
constants.ts
And here I try to import this file:
DropdownAlertCustom.tsx
After that, I get this error:
error message
What am I doing wrong? And how I can fix it?
UPD
Small fix of tsconfig.json:
small fix
Now I get the error 'Cannot find a module or it's corresponding type declarations:
Cannot find module
UPD 2
I understood that my IDE and VSCode see files and folders fine by these paths. When I hover on them, I can see their's content. I get the error Module not found. Can't resolve 'assets/styles/constants' when I type expo start --web. It starts in a browser and I get this error.
Maybe the problem is in Expo? I've added it in Create React Native app.
If anyone has any suggestions, please, help.
Replace assets/styles/constants with ../../../assets/styles/constants
Explanation
If you import like this assets/styles/constants, webpack that compiles your project into common js file that thinks that assets is the package name and that's why it will find in node_mouldes folder and it cant resolve the folder.
so if you want to import something from your local files you can give a relative path to that folder and import it successfully like I specified ../../../assets/styles/constants.
EDIT 1
It's the only way that create-react-app provides you to import any file but, there is another way you can build it manually called absolute path.
Like you can tell webpack that make src folder as the root of my project and if I specify # in URL than means its absolute path and root is src
after that you can call it as
#/assets
#/pages
#/store
#/anything/any
I have a custom files like
- bootstrap.css
- bootstrap.js
- owl-carosel.min.css
- owl-carosel.min.js
etc. I want to add them locally from my assets folder inside src to my index.js
I have tried adding them to my index.html but the problem is i have to move my assets folder to public folder.
When i try adding them using import statement it Fails to compile
Error:
Failed to compile
./src/assets/css/font-awesome.min.css (./node_modules/css-loader/dist/cjs.js??ref--6-oneOf-3-1!./node_modules/postcss-loader/src??postcss!./src/assets/css/font-awesome.min.css)
Module not found: Can't resolve '../fonts/fontawesome-webfont.eot' in '/home/cedex12/Gokul/food-day/src/assets/css'
Can we add them like
Step1:'bootstrap': 'file:/path/to/your/repo'
Step2:npm install
I want to integrate them to my index.js file.
With js you can use the function import() that allow you to import external js file in a js file ;) Just read the doc
try using react-bootstrap framework its build with react components! here a link:https://react-bootstrap.github.io/
I'm trying to use PrimeReact components on a Next.js project but I'm getting an error when I try to import the core css styles as shows in their documentation (https://www.primefaces.org/primereact/#/setup), I have used these components with a create-react-app project, but this time I'm having the following error:
Next js error
I'm using "#zeit/next-sass" and "node-sass" to work with SASS files, I read that is required to create a "webpack.config.js" to manually apply the right loaders but the problem persist (I'm not a webpack expert), I was wondering if someone can give me a hint of what I'm missing.
Thank you in advance.
I am trying to use bootstrap js features following the angular-meteor tutorial
In that tutorial(see link) they have integrated bootstrap sass files. But how do I integrate the bootstrap.js file?
I tried using
import { bootstrap } from 'bootstrap';
In the main.ts file, but this is not working(IDE shows cannot resolve file bootstrap).
Surprisingly, my node_modules has the bootstrap package installed(the boostrap.sass gets imported successfully). Here is how my node_modules look like:
So how do I import this bootstrap.js file?
EDIT: Things I further tried are:
import bootstrap from 'bootstrap/dist/js/bootstrap' does not work and gives error "Cannot find module 'bootstrap/dist/js/bootstrap'"
import 'bootstrap/dist/js/bootstrap' works but this demands that tether be added as dependency. I added tether via npm and then added it(import 'tether/dist/js/tether') before above import in main.ts but this too does not solve the problem browser console says:
bootstrap.js:2785 Uncaught Error: Bootstrap tooltips require Tether
(http://github.hubspot.com/tether/)
I'm working on a project that is built as an isomorphic React app using Redux, and webpack as well. I'm new to all of these technologies, and I would like to load 2 files into webpack for syntax highlighting in one of my react components.
In addition to these technologies the project is also built using React Helmet to manage the document head.
Having not used webpack all that much before I tried adding the reference to my two files in the head and body blocks as such:
<script src="path/to/file/fileName.js" type="text/javascript"></script>
however that throws the following error:
Uncaught SyntaxError: Unexpected token <
I've also tried adding it to my React Helmet config as a script...
script: [
{"src": "path/to/file/fileName.js", "type": "text/javascript"}
],
...but I'm getting the same error
How can I load this file into my webpack bundle so it is available across the app without it having to be required by a specific component?
I think you can use import or require in your code and webpack add that file to bundle. File will be AMD or Common.js module.