我尝试使用通常的 import Vuetify from "vuetify/lib"
来引用 vuetify/lib
,但是当我这样做时,应用程序会在 IE11 中因 SCRIPT1003:应为“:”
。
如果我更改对 import Vuetify from "vuetify"
的引用 - 没有 /lib
部分 - 它不会抛出错误。
请注意,我实际上还没有在任何地方使用 vuetify。我没有任何 Vuetify 组件或调用;我只是添加库。
现在我表面上已经包含了 vuetify 并被 IE11 愉快地解析,我想使用其中的一些组件。如果我在模板中放置任何 vuetify 组件,IE11 会抛出 Script1002:语法错误
消息。
有人有建议让它真正发挥作用吗?
Index.cshtml
<v-app>
<div id="reportApp"></div>
</v-app>
入口点
// polyfills
import "core-js/stable";
import "regenerator-runtime/runtime";
import Vue from "vue"
import "@mdi/font/css/materialdesignicons.css"
import reportFilter from "./reportFilter.vue"
const options = {
el: "#reportApp",
render: h => h(reportFilter)
};
export default new Vue(options);
reportFilter.vue
<template>
<div>
<!-- this will throw a syntax error -->
<v-progress-circular indeterminate color="primary"
></v-progress-circular>
</div>
</template>
<script>
import axios from 'axios'
export default {
name: 'report-filter',
data: function(){
return {
dataTypeList: [
{ value: "1", text: "one" },
{ value: "2", text: "two" },
{ value: "3", text: "three" }
]
}
},
}
</script>
webpack.config.js
const path = require("path");
const fs = require("fs");
const { VueLoaderPlugin } = require("vue-loader");
const VuetifyLoaderPlugin = require("vuetify-loader/lib/plugin");
module.exports = {
entry: jsEntries, // setting jsEntries removed for clarity
mode: "development",
module: {
rules: [
// other rules for css/sass/etc removed for clarity
/*javascript*/{
test: /\.m?js$/,
exclude: [
/node_modules/,
/bower_components/
],
use: {
loader: "babel-loader",
options: {
presets: [
[
"@babel/preset-env",
{
"targets": {
"browsers": [
"last 2 versions",
"ie >= 11"
]
},
"corejs": "3",
"useBuiltIns": "entry"
}
]
]
}
}
},
/*vue*/{
test: /\.vue$/i,
use: "vue-loader"
}
]
},
output: {
filename: "[name].js",
path: path.resolve(__dirname, "./wwwroot/dist/js/"),
publicPath: "/wwwroot/dist/js/"
},
plugins: [
new VueLoaderPlugin(),
new VuetifyLoaderPlugin()
],
resolve: {
alias: {
vue: "vue/dist/vue.js"
}
}
};
最佳答案
在我这边,SCRIPT1002:语法错误
已通过更新webpack-dev-server
解决。
尝试将 webpack-dev-server
版本更改为 3.8.2
并删除 node_modules
和 npm install
再次。
还有一个。
//.babelrc
{
"presets": ["@babel/preset-env"]
}
//babel.config.js
module.exports = {
presets: ['@babel/preset-env']
}
You can install vuetify in three ways:
default installation
The first (and recommended) way is to utilize the vuetify-loader or what we call automatic A-la-carte. This will ensure that your application only uses the features and styles from Vuetify that are needed, significantly reducing your application's compiled size and is setup you will see in a new vue-cli-3 project. Keep in mind, when importing from vuetify/lib, the necessary styles are automatically imported for you.
vue-cli a-la-carte installation
You can also manually import individual components without the need for the vuetify-loader. This is considered manual A-la-carte.
(And about your done:
import Vuetify from 'vuetify'
)vue-cli full installation
The last method will import and setup all of Vuetify's features and styles. As stated above, it is still recommended that you utilize the vuetify-loader if at all possible. For this install, you will need to manually import the Vuetify styles. This is also the process used when bootstrapping Vuetify through a browser as opposed to compiling.
import Vue from 'vue'
import Vuetify from 'vuetify'
import 'vuetify/dist/vuetify.min.css'
Vue.use(Vuetify)
const opts = {}
export default new Vuetify(opts)
祝你好运。
关于asp.net-core - IE11 的 Vuetify/Lib Polyfilling 不起作用 - SCRIPT1002 : Syntax Error,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/58228120/