I'm starting to experiment with Polymer 1.0 and am having issues with the vulcanize process. I have included a separate html file for all of my component imports that is loaded via an import in index.html. This site is currently a single page with a paper-drawer-panel a couple of paper-header-panels (drawer and main) with paper-toolbars inside them. This all works perfectly before I vulcanize the site. Once I vulcanize the site the paper-drawer-panel renders the "main" section above the "drawer" section no matter the screen size.
Before Vulcanize (drawer opened)
After Vulcanize
I've done some investigation and this page states that vulcanize versions 1.0+ are for Polymer version 0.8+. The current version of vulcanize is 1.8.1 so I'm assuming that works for Polymer 1.0. Now, when I install grunt-vulcanize that includes vulcanize 0.7.9 which according to the documentation is not compatible with Polymer 1.0. Here is the output from npm list:
npm list -g vulcanize
/usr/local/lib
├─┬ grunt-vulcanize#0.6.4
│ └── vulcanize#0.7.9
└── vulcanize#1.8.1
So how do I get grunt-vulcanize to use vulcanize 1.8.1?
grunt-vulcanize is not compatible with vulcanize 1.8.1, because last update on github was on Feb 9 with version 0.6.4. It's out of date plugin for Polymer 0.8+. I've met same issue in my grunt project with Polymer 1.0 today and I didn't find how to vulcanize polymer elements in grunt project
grunt-vulcanize on github https://github.com/Polymer/grunt-vulcanize
after little search I found that issue on that was opened 5 days ago
https://github.com/Polymer/grunt-vulcanize/issues/21
one github user leave comment that he made temporary adaptation for grunt-vulcanize which works with vulcanize 1.8.1 and Polymer 1.0. I hope it will help
https://github.com/kgadzinowski/grunt-vulcanize/
Related
What is the point of implementing migrations if the down script is missing while checking out to previous state of repository?
Example:
I have implemented migrations succesfully. Repo version is 0.0.1.
// repo version 0.0.1
migrations/
└── 001.js
I have implemented a new feature that requires migrations in version 0.0.2:
// repo version 0.0.2
migrations/
├── 001.js
└── 002.js (new feature)
I checkout repository to previous 0.0.1 version, due to a bug. But I cant run the down script of migration 002.js because at this point it didn exist yet:
// repo version 0.0.1
migrations/
└── 001.js
So do I have to run the migration to the correct version manually before checking out to the previous state (npm run migrate:001)? This is a very easy and doable example. But it might get confusing over multiple branches.
While optimizing a small app, I noticed this oddity from the visualizer :
$ meteor --extra-packages bundle-visualizer --production
Why is there two (2) React-DOM modules loaded?
** Edit **
I'm trying to find which package depends of react-dom-development; why would it be included?
I am facing an issue with code highlighting when using prism-react-renderer component in Gatsby. I have configured it as per instructions in FormidableLabs/prism-react-renderer.
Everything works in development mode, but when I build a production version with the gatsby build command, the pre tag is not decorated with prism classes (class="prism-code language-python" is missing). My guess is that the production build does not include the right component or CSS, but I don't know where to start looking.
Also, this issue was not present when I used the same code 7-8 months back in another project. So it may be a problem introduced in the past few months because of a plugin/component update.
Attached are two screenshots - one with gatsby develop and another with gatsby build.
Commands I ran to setup and install the requisites:
> gatsby new test-mdx-prism-rendering https://github.com/gatsbyjs/gatsby-starter-hello-world
> npm install --save gatsby-plugin-mdx #mdx-js/mdx #mdx-js/react
> npm install --save mdx-utils
> npm install --save prism-react-renderer
Sample GitHub project is at subhashb/test-mdx-prism-rendering
Found the answer as I tried to dig deeper.
The workaround is discussed here: https://github.com/ChristopherBiscardi/gatsby-mdx/issues/394
Apparently, the wrapRootElement defined in gatsby-browser.js should be made available in gatsby-ssr.js as well.
I have this project, was created with the latest version of expo and typescript, (I chose it from the cli).
Everything works well, also I added it with the expo-yarn-workspaces package, but I have this error when I try to scan the QR code with my android phone:
In packages/app you can find the react-native code...
I haven't added any logic to this app, it's only the default template that expo-cli creates.
This problem was a serious headache. Fortunately, I think I've got the fix for you.
Check the node_modules folder of your mobile application and ensure expo and react-native are both symlinked to the workspace-root's versions of these packages. In my case, the mobile application had a second copy of react-native rather than being symlinked, which was the cause of my trouble.
Edit - More clarity:
TL:DR If your react-native and expo folders inside of your mobile app's node_modules folder are not symlinked, delete them and rerun the expo-yarn-workspaces postinstall from the folder for your mobile app, NOT from the project root. These modules should only appear in the top level node_modules folder.
Example Project structure
/MyRoot
/node_modules
/react-native
/expo
/packages
/YourMobileApp
/node_modules
/react-native -- This should be a symlink to /MyRoot/node_modules/react-native
/expo -- This should be a symlink to /MyRoot/node_modules/expo
/SomePackage
/SomeOtherPackage
Example of what properly symlinked folders look like (Windows 7)
I've had an issue with GlyphIcons not loading correctly when using this bower component: https://github.com/twbs/bootstrap-sass
I tracked down the issue to finding an #at-root element being injected into my CSS file.
I was able to get glyph icons working by removing the element, IMHO this is a damn useless SASS selector that does not add much value in the context it was being used.
Once I tracked down the issue, I then looked at the issues register in their GIT repository and found this item that suggested that the version of SASS compiler needed to be at least 3.3. See: https://github.com/twbs/bootstrap-sass/issues/953.
I am on windows and just using bower components so I did a re-installation of Boostrap-Sass
bower install bootstrap-sass -g
But this did not resolve my problem.
I'm not sure what the issue is, I hope someone has a solution to getting the latest bootstrap sass working on a windows/node environment.
For now I have fixed the issue by find the 2 references to #at-root in folder bootstrap-sass-official and just removing them.
Installed the latest version of Ruby
I followed this link http://awordpress.net/blog/install-sass-compass-manually-windows/ for doing manual install of SASS.
I'm not sure why I could not get compass to install (as per the link above) but it did not matter as the firth point in that link was all I needed to get SASS updated on a windows
gem install sass