Have seen other posts but none of the suggested solutions there worked.
So I still see these duplicate identifier errors even though I excluded the whole typings folder. typings folder is in the same level of node_modules and bower_components folder
Here's my typings.json as suggested by Angular 2:
{
"globalDependencies": {
"core-js": "registry:dt/core-js#0.0.0+20160317120654",
"es6-shim": "registry:dt/es6-shim#0.31.2+20160317120654",
"jasmine": "registry:dt/jasmine#2.2.0+20160412134438",
"node": "registry:dt/node#4.0.0+20160509154515"
}
}
What do I need to do? :(
PS: I uninstalled the TypeScript for Visual Studio which is version 1.8.6 and just used the npm typescript which is 1.8.10. Previously, they were installed together in my machine but still not works.
Your typings are really strange, you should have either es6-shim or core-js, not both of them. node is most probably redundant too.
Personally, i gave up on VS and plugged angular using gulp build file.
Your exclude isn't right. Assuming you are using Typings version 1.0 or later, it should look like this given the screen shot you added.
"exclude": [
"node_modules",
"bower_components",
"typings/index.d.ts",
"typings/modules"
],
Related
I've been trying to fix this for the last 2hrs now.
The thing, is I have upgraded to laravel 5.8 from 5.7. I had defined an alias
resolve: {
alias: {
"~": path.resolve(__dirname, "resources/js"),
}
}
but now, after the upgrade, laravel mix can't resolve any of the files with this alias.
I am using phpstorm idea though, I have linked webpack.config.js with phpstorm and works just file but this is not compiling with laravel mix.
I have:
removed node-modules and reinstalled again
removed package-lock.json
npm cache --clear --force
installed yarn tried with it nothing
installed babel-loader and vue-loaders nothing still
had installed some eslint-import-resolver-alias
Done all the above and still gets the error:
Actually found my issue: I hadn't somehow, I had deleted the import on webpack.config.js in webpack.mix.js
I have an existing ASP.net application in Visual Studio. Until recently I only used JavaScript. Now I want use Typescript. Installing and transpiling works great. However, I got stuck when I wanted to import modules.
My idea was to use npm for loading modules, e.g. I added to package.json:
"devDependencies": {
"typestyle": "^1.7.1",
}
which I want to import in my .ts file via:
import { style } from 'typestyle';
The problem: npm downloads to folder node_modules which does not belong to my project (but it is inside my project folder); the import statement does not find the required files.
Currently I am using requirejs to enable import statements as explained here. My tsconfig.json looks like this:
{
"compilerOptions": {
"noImplicitAny": true,
"noEmitOnError": true,
"sourceMap": true,
"target": "es5",
"module": "amd",
"moduleResolution": "node"
}
}
I can download typestyle.js manually, put it in my project folder, and configure the requirejs configuration file main.js so that it finds it. But then I am not using npm.
How can I import modules that I loaded with npm? I'd like to use requirejs. I do not want Angular or React. If possible I also want to avoid other things which make my project unnecessarily complicated (Mocha, node.js, knockout, Webpack, Gulp, Browserify, ...)
EDIT
Okay, after reading NPM vs. Bower vs. Browserify vs. Gulp vs. Grunt vs. Webpack I guess I do need a module bundler like Webpack or Browserify. But maybe there is some tool integrated in VS2017 which I could use?
EDIT2
And after reading How it feels to learn JavaScript in 2016 (note: this is 2018) I understand that it might be too much to ask for a simple solution...
Finally I found a solution which suits my needs. Since it is very lengthy I'll just post the link (project source code)
http://codingsight.com/using-npm-webpack-and-typescript-to-create-simple-aspnet-core-web-app/
Only drawback so far: It uses Webpack instead of requirejs. Webpack is a module packer. All .js files/modules are combined into one huge .js. No lazy loading by default.
I've got these plug-ins in my project
babel-traverse
babel-types
babylon
How do I update these to the latest?
Including typescript plugin.
In my node_modules folder - i've got a bunch of entries that I did not install
adm-zip
inflight
minimatch
lazy
mkdirp
and others - anyone how how it got there?
Running npm outdated shows outdated packages. npm update updates packages. And you need to check the versions listed in package.json to see if they're locked at specific version or if you allow minor/major bumps when running install. There are hundreds of tutorials on using npm and understanding the package.json. those packages you mention, I wouldn't mess with too much. those are added by nativescript to make things work in a sense. So they're dependencies for nativescript they don't actually get packaged with your app (I don't believe, haven't checked that in a build to be certain).
I am starting a new Laravel project with v5.2 and I would like to use Zurb Foundation v6.2.
I've seen that Zurb Foundation can be installed through composer and since I've installed Laravel through composer, I thought it as a good idea.
I did it, Foundation is in the vendor (vendor/zurb/foundation) folder.
It has also been added to the composer.json:
"require": {
"php": ">=5.5.9",
"laravel/framework": "5.2.*",
"zurb/foundation": "^6.1"
},
But now, how can I use it? Where should I create my css file(s)? In the resources/assets/sass folder where Laravel already provides a scss file (app.scss)? If so, how can I link it to Zurb Foundation?
Thanks a lot for your help.
I think Laravel Elixir is more suitable for this purpose.
From the guide:
Installing Node
Before triggering Elixir, you must first ensure that Node.js is installed on your machine.
node -v
By default, Laravel Homestead includes everything you need; however, if you aren't using Vagrant, then you can easily install Node by visiting their download page. Don't worry, it's quick and easy!
Gulp
Next, you'll want to pull in Gulp as a global NPM package like so:
npm install --global gulp
Laravel Elixir
The only remaining step is to install Elixir! With a new install of Laravel, you'll find a package.json file in the root. Think of this like your composer.json file, except it defines Node dependencies instead of PHP. You may install the dependencies it references by running:
npm install
Then to install Foundation 6 for Sites it's recommended to use Bower, (another) package manager, but specifically for managing frontend facing libraries like Foundation and jQuery.
You can have a look at Zurb's example template for better understanding.
npm install --global bower
Create a file named bower.json:
{
"name": "my-site",
"dependencies": {
"foundation-sites": "~6.1.2",
"motion-ui": "~1.1.0",
"foundation-sites": "~6.2.0",
"motion-ui": "~1.2.2"
},
"ignore": [
"**/.*",
"node_modules",
"bower_components",
"test",
"tests"
],
"private": true
}
Then run bower install.
In app.scss, import Foundation:
#import 'foundation';
#include foundation-everything;
Then in gulpfile.js, compile it to CSS:
mix.sass('app.scss', 'public/css/app.css', {
includePaths: [
'bower_components/foundation-sites/scss/'
]
});
Finally to compile, run:
gulp
I think npm way is better suited for front-end stuffs. Take a look at this:
http://somethingnewtutorial.blogspot.com/2017/07/using-foundation-6-with-laravel-5.html
If you are using earlier version, its just using gulp instead of laravel-mix.
Is it possible to use Bourbon and it's additional components without needing to have Ruby installed? We'd like to experiment on a small project, but it's a pain to get dependencies approved by the desktop engineering folks.
I've noticed that there are Bower packages for all but Bitters. Can I just grab the scss files from GitHub and wire things up manually?
Seems the devs don't want to have bitters on bower: https://github.com/thoughtbot/bitters/issues/22.
That said, you can get bitters with bower if you use a zipball from git as a version (e.g. https://github.com/thoughtbot/bitters/archive/master.zip).
If you want more control on how to bring those files in your project, gulp-bower-normalize can help — an example bower.json file:
{
"name": "project-x",
"dependencies": {
"bitters": "https://github.com/thoughtbot/bitters/archive/master.zip",
},
"overrides": {
"bitters": {
"main": [
"app/assets/stylesheets/*.scss"
],
"normalize": {
"css/base": "**/*.scss"
}
}
}
}
Had this same question recently as I'm using Bourbon/Neat in a static site project. I've found that the 'bourbon' and 'neat' commands do nothing more that replicate the hierarchy of library files into your project directory. At that point you can use the libraries with any workflow which is able to preprocess sass/scss files.
In my case I'm using them successfully with the Python WebAssets library from within Pelican, you might be able to find another sass preprocessor that fits into your setup.
If you can get node installed on your dev machine check out Yeoman. It uses Grunt and Bower to generate a web app that uses Sass. Then you can install Bourbon and Neat using Bower. It does a lot of the heavy lifting for you.