你说的是如何引入，我只通过iframe的方式引入过腾旭地图的页面。
vue中可以把html文件引入到vue文件中使用吗？
vue中可以把html文件引入到vue文件中使用吗？
- 点赞
- 写回答
- 关注问题
- 收藏
- 复制链接分享
- 邀请回答
2条回答
相关推荐
- 回答 2 已采纳 vue中可以把html文件引入到vue文件中使用吗？
- 回答 1 已采纳 vue cli4 如何全局引入js？没有看到index.js文件 看官网文档说是使用了html-webpack-plugin 但是具体如何配置呢？
- 回答 2 已采纳 **webpack4.0中引入app.vue出现报错** 我正在学vue.js实战，但是这本书事两年前写的，书中的vue配置有些已经不能用了， 我在配置完webpack.config.js后创建了个app.vue，然后就报错了，百度过，没找到合适的答案，请问各位大佬有遇到过吗。求解答，谢谢，下面是报错截图，以及webpack.config.js的截图，谢谢   **webpack.config.js:** var path = require('path'); var ExtractTextPlugin = require('extract-text-webpack-plugin'); var config = { entry : { main : './main' }, output : { path : path.join(__dirname, './dist'), publicPath : '/dist/', filename : 'main.js' }, module: { rules: [ { test: /\.vue$/, loader : 'vue-loader', options : { loaders : { css : ExtractTextPlugin.extract({ use : 'css-loader', fallback : 'vue-style-loader' }) } } }, { test : /\.js$/, loader : 'babel-loader', exclude : /node_modules/ }, { test : /\.css$/, use : ExtractTextPlugin.extract({ use : 'css-loader', fallback : 'style-loader' }) } ] }, plugins : [ //重命名提取后的css文件 new ExtractTextPlugin("main.css") ] }; module.exports = config; **package.json:** { "name": "vuedemo04", "version": "1.0.0", "description": "", "main": "index.js", "scripts": { "test": "echo \"Error: no test specified\" && exit 1", "dev": "webpack-dev-server --host 192.168.0.114 --port 8888 --open --config webpack.config.js" }, "author": "", "license": "ISC", "devDependencies": { "@babel/core": "^7.6.0", "@babel/plugin-proposal-class-properties": "^7.5.5", "@babel/plugin-transform-runtime": "^7.6.0", "@babel/preset-env": "^7.6.0", "@babel/runtime": "^7.6.0", "babel": "^6.23.0", "babel-core": "^6.26.3", "babel-loader": "^8.0.6", "babel-plugin-transform-runtime": "^6.23.0", "babel-preset-env": "^1.7.0", "babel-preset-es2015": "^6.24.1", "babel-runtime": "^6.26.0", "css-loader": "^3.2.0", "extract-text-webpack-plugin": "^4.0.0-beta.0", "style-loader": "^1.0.0", "vue-hot-reload-api": "^2.3.3", "vue-loader": "^15.7.1", "vue-style-loader": "^4.1.2", "vue-template-compiler": "^2.6.10", "webpack": "^4.39.3", "webpack-cli": "^3.3.8", "webpack-dev-server": "^3.8.0" }, "dependencies": { "vue": "^2.6.10" } } **main.js:** import Vue from 'vue'; import App from './app.vue'; new Vue({ el:'#app', render : h => h(App) }); **app.vue:**  **style.css:**  **index.html:**  **vue项目结构：**
- 回答 2 已采纳  我就想全局引用一个feather icon的js，为啥这样写不行，我不想单独写在index里面，就像全局写一个所有页面自动引用
- 回答 1 已采纳 通过运行uni-app项目生成命令： ``` vue create -p dcloudio/uni-preset-vue my-project ``` 自动生成了项目，观察项目中的main.js 最后是这样写的 ``` const app = new Vue({ store, ...App }) app.$mount() ``` 它应该是被挂载到了template.h5.html这个文件中的#app节点 ``` ``` 根据vue官方对$mount方法的说明（[$mount](https://cn.vuejs.org/v2/api/#vm-mount "$mount说明") ），$mount如果不带任何参数的话，是需要在后续使用document.xxx这样的方法来定义挂载节点的，但我找了整个项目，也没找到有哪里写了这么一行。 那么它到底是在哪里进行App.vue这个根组件的挂载的呢？ 有熟悉uni-app的朋友来指导一下吗？ -------------------- 找到答案了，是在uni-app的源码中实现了$el的定义 https://github.com/dcloudio/uni-app/blob/master/src/core/service/plugins/app/index.js 在以上文件中有一个beforeMount方法定义了$el的挂载位置 ``` beforeMount: function appBeforeMount () { // TODO 平台代码 this.$el = document.getElementById('app') }, ```
- 回答 4 已采纳 我在尝试学习es6的模块的时候，百度发现需要将script的type设为module才可以将js文件引入，但是在谷歌运行后报了类似跨域问题的错，本来我就迷迷糊糊的，百度也没找到原因，路过的朋友瞅一瞅我这个问题！！！！！感激不尽！！朋友们！！ 下面是我的图 **(bar.js文件中的代码)**  **test.html中引入bar.js**  **报错信息** 
- 回答 2 已采纳 问题截图：  问题描述： 编译工具webstorm，使用npm命令 dev运行项目报错。 搭建过程： 按照官方教程执行了 1.使用命令安装element组件 ``` npm i element-ui -S ``` 2.安装babel组件 ``` npm install babel-plugin-component -S ``` 3.main.js引用 ``` import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.config.productionTip = false Vue.use(ElementUI); ``` 4.页面中使用element组件 ``` 2 默认按钮 主要按钮 成功按钮 信息按钮 警告按钮 危险按钮 ``` .babelrc文件修改后报错，es2015，安装后无法使用，还原成系统默认配置。 以下为相关文件的具体内容： package.json ``` { "name": "vuetest3", "version": "1.0.0", "description": "A Vue.js project", "author": "811204266@qq.com ", "private": true, "scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js", "start": "npm run dev", "unit": "jest --config test/unit/jest.conf.js --coverage", "e2e": "node test/e2e/runner.js", "test": "npm run unit && npm run e2e", "lint": "eslint --ext .js,.vue src test/unit test/e2e/specs", "build": "node build/build.js" }, "dependencies": { "axios": "^0.18.0", "babel-polyfill": "^6.26.0", "vue": "^2.5.2", "vue-router": "^3.0.1" }, "devDependencies": { "autoprefixer": "^7.1.2", "babel-core": "^6.22.1", "babel-eslint": "^8.2.1", "babel-helper-vue-jsx-merge-props": "^2.0.3", "babel-jest": "^21.0.2", "babel-loader": "^7.1.1", "babel-plugin-component": "^1.1.1", "babel-plugin-dynamic-import-node": "^1.2.0", "babel-plugin-syntax-jsx": "^6.18.0", "babel-plugin-transform-es2015-modules-commonjs": "^6.26.0", "babel-plugin-transform-runtime": "^6.22.0", "babel-plugin-transform-vue-jsx": "^3.5.0", "babel-preset-env": "^1.3.2", "babel-preset-es2015": "^6.24.1", "babel-preset-stage-2": "^6.22.0", "babel-register": "^6.22.0", "chalk": "^2.0.1", "chromedriver": "^2.27.2", "copy-webpack-plugin": "^4.0.1", "cross-spawn": "^5.0.1", "css-loader": "^0.28.0", "eslint": "^4.15.0", "eslint-config-standard": "^10.2.1", "eslint-friendly-formatter": "^3.0.0", "eslint-loader": "^1.7.1", "eslint-plugin-import": "^2.7.0", "eslint-plugin-node": "^5.2.0", "eslint-plugin-promise": "^3.4.0", "eslint-plugin-standard": "^3.0.1", "eslint-plugin-vue": "^4.0.0", "extract-text-webpack-plugin": "^3.0.0", "file-loader": "^1.1.4", "friendly-errors-webpack-plugin": "^1.6.1", "html-webpack-plugin": "^2.30.1", "jest": "^22.0.4", "jest-serializer-vue": "^0.3.0", "nightwatch": "^0.9.12", "node-notifier": "^5.1.2", "optimize-css-assets-webpack-plugin": "^3.2.0", "ora": "^1.2.0", "portfinder": "^1.0.13", "postcss-import": "^11.0.0", "postcss-loader": "^2.0.8", "postcss-url": "^7.2.1", "rimraf": "^2.6.0", "selenium-server": "^3.0.1", "semver": "^5.3.0", "shelljs": "^0.7.6", "uglifyjs-webpack-plugin": "^1.1.1", "url-loader": "^0.5.8", "vue-jest": "^1.0.2", "vue-loader": "^13.3.0", "vue-style-loader": "^3.0.1", "vue-template-compiler": "^2.5.2", "webpack": "^3.6.0", "webpack-bundle-analyzer": "^2.9.0", "webpack-dev-server": "^2.9.1", "webpack-merge": "^4.1.0" }, "engines": { "node": ">= 6.0.0", "npm": ">= 3.0.0" }, "browserslist": [ "> 1%", "last 2 versions", "not ie 2 默认按钮 主要按钮 成功按钮 信息按钮 警告按钮 危险按钮 ``` main.js ``` // The Vue build version to load with the `import` command // (runtime-only or standalone) has been set in webpack.base.conf with an alias. import Vue from 'vue' import App from './App' import router from './router' import ElementUI from 'element-ui' import 'element-ui/lib/theme-chalk/index.css' Vue.config.productionTip = false Vue.use(ElementUI); /* eslint-disable no-new */ new Vue({ el: '#app', router, components: { App }, template: '' }) ``` router/index.js ``` import Vue from 'vue' import Router from 'vue-router' import Home from '@/page/Home' Vue.use(Router) export default new Router({ routes: [ { path: '/', name: 'Home', component: Home } ] }) ```
- 回答 4 已采纳 ``` 比如我想的显示效果： **速度：20** html应该这么写： **速度:** 没毛病，但是如果20需要求，比如给个长度100，时间为5，如果都是int型的也没毛病，如果长度时间都是string的，怎么办。 ****是错的，简单的说就是中怎么把string变成int型的，试过parseInt和Number,都不信，求大神指点！ ```
- 回答 5 已采纳 如题，如何编写xmlns？以及对应的dtd文件，最近在写自定义标签，不知道这个对于自定义标签有没有用，求前辈告知
- 回答 2 已采纳 我在网上搜过如何自定义404页面，但是找到的答案是跳转到视图， 我的站点程序中没有cshtml视图，只有静态页面，如何实现跳转到静态页面。 **要求不重定向，即不改变浏览器的URL**
- weixin_39949473的博客 如何利用Vue.js库中的v-html指令添加html元素vue组件中怎么引入html文件？HtmlPanel.vue文件 export default{ // 使用时请使用 :url.sync=""传值 props: { url: { required: true } }, data () { return { loading: ...
- 忘却留疤的博客 在vue中引入.html文件，我们一般的思路是先新建一个容器，然后再在vue中将HTML文件引入，然后再给容器的innerHTML属性进行赋值，照着这个思路干就对了。 3.解决方案： 1.首先我们新建一个这个容器，这个容器我...
- 喂，小猴子的博客 在vue中如果把所有的代码都写到一个页面中，有时比较难找，显得比较复杂，所以一些js代码会写在外面的js文件中，然后引入到使用的页面中。 可以在src下新建一个文件夹去存这个js文件，例如：DateToString.js,一定要...
- 2年前jojo付啾啾的博客 转自：https://www.2cto.com/kf/201708/666425.html
- 2年前ChrisWang_的博客 一些小js插件可能无法通过npm安装，需要我们手动...下面就是如何在vue中引入了 1. 首先改一下zoom源码 加上export 2. 然后在需要用到的.vue组件中引入，我这里common路径是配好的相对路径 3. 然后就可以像...
- 御前提笔小书童的博客 在VUE项目中的index.html中引入CSS等静态文件，经常会遇到无法加载的问题，例如下图： 问题分析及解决 引入的静态文件在src文件夹内 index.html中不能引入src目录下的文件，否则即使不报错，样式也会...
- 侧耳倾听...的博客 我在index.html 引入了一个js,在其他的组件中用window获取显示undefined webpack.dev.conf.js webpack.prod.conf.js index.js
- 6月前wowpH的博客 本文的目的是学习如何在html中使用vue组件。主要内容是使用组件以有序列表的形式展示数组的数据。主要知识点有html，vue，v-for指令，js等等。
- 小达哥的垃圾桶的博客 直接在html文件中引入vue.js开始学习,了解vue的基础指令，和整个vue实例的基础架构。 下载vue.js 地址：https://download.csdn.net/download/qq_31122833/10723310，下载完之后在HTML中加入v...
- 1年前huakaiwuxing的博客 js文件一定要放在...今天做一个 VUE 的项目，在引入第三方依赖的 JS 文件时，遇到了一个问题： 控制台的提示：Uncaught SyntaxError: Unexpected token < 按照提示进入文件，再看如下图： 仔细看了看 ..