ionic/angular2 - Refused to apply style from '

问题:

My ionic build was working perfectly up until I wanted to test on my iPhone so I stopped my server and then did a ionic serve --address localhost and I noticed that my stylesheet wasn't loading anymore... so I killed the server again went back to ionic serve and the error persisted..

(index):1 Refused to apply style from 'http://localhost:8100/build/main.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

I've tried clearing the the cache on localhost:8100 and rebuilding the project but the error remains...

Any ideas? I'm pretty much stuck until this gets resolved :(

Edit: The way I ended up fixing it might not be the best.. but at least it works again. I just went into my github repository for my app downloaded the main.css and pasted it into the build folder and I've not had a problem since.

回答1:

I followed these instructions which were posted on ionic framework forum.

Steps: serve your project with ionic serve and then just change any .ts file and save it (ctrl+s) and it will automatically build again and serve the app & error will be resolved, hopefully :).

Note: you have to do this everytime on the initial ionic serve

check out the full answer here

回答2:

I believe there may be some compatibility problems with Webpack (or other packages). This seems to have be introduced with the @ionic/app-scripts version 3.2.*. Use any version up to 3.1.11 and this problem does NOT occur. I would suggest do the following:

• in your package.json change the version of @ionic/app-scripts to "@ionic/app-scripts": "^3.1.11"
• delete the package-lock.json file
• delete your node_module folder
• run npm install
• ensure that the version of @ionic/app-scripts is lower than 3.2

回答3:

FYI ran into exactly the same issue after I upgrade webpack. My version of webpack was ^3.11.0, then went to 4.x.x which caused a lot of issues. Recommend you downgrade webpack until ionic supports the newer version of webpack.

回答4:

I had the same problem, with Ionic 3.

For a solution to the problem I add the type in the corresponding tag like this:

<script type="application/javascript" src="assets/js/lalalala.js"></script>
<script type="application/javascript" src="assets/js/lalala.js"></script>

(In my case the problem was with JS) Then, is needed restart the app with "ionic serve" , else the problem persist.

回答5:

In my case just saving my index.html got rid of the problem.

Also, I am having to undo (delete) my symbolic links and use actual copies of folders from a similar sister project. :(

回答6:

I found the solution to fix it but don’t know the ultimate cause of this. Solution -> Just go to any of the .ts files like user.ts or app.ts and press ‘CTRL+S’. Now it will automatically again build and serve your app and once build is finished ,your app will run fine.

You will have to do this each time you write fresh ‘ionic serve’ in terminal. But not required if automatically build during development cycle on pressing ‘CTRL+S’.

回答7:

You need to have a look in your index.html file and look for . Like it says in the error message yours must be set to instead of .

Your css is being imported as the wrong type.

回答8:

Perhaps not the best strategy to solve this problem, but what worked for me was creating a new blank project, installing all extra plugins by hand, and then replacing the whole src folder to this new project. Some adjusting may be required for files config.xml and package.json.

In commands that is:

~user/DevFolder/ $ ionic start DummyProject blank
~user/DevFolder/ $ cd DummyProject
~user/DevFolder/DummyProject/ $ ionic cordova plugin add cordova-plugin-advanced-http
~user/DevFolder/DummyProject/ $ rm -fr src
~user/DevFolder/DummyProject/ $ cp -r ../FailingProject/src .
~user/DevFolder/DummyProject/ $ ionic serve -lcs

For the commands I used ~user/DevFolder as the folder where all your projects live, and cordova-plugin-advanced-http as the plugin. Remember to answer Y when the command line requires it.

At least for me the problema was solved, but no idea why this happened. Hope it helps.