У меня есть функция, которая определяет, какой путь к файлу scss будет возвращаться на основе условия.Эта часть работает правильно.Это будет экспортировать файл.Когда я загружаю файл в app.js, я использую оператор require ().Требование возвращает функцию, когда я проверяю ее в Dev Tools.Мне нужно, чтобы он ссылался на путь, чтобы он загружал scss.
Я пробовал vanilla.js вызывать те же функции и прикреплять новый элемент внутри заголовка.Я проверил, что пути к href были правильными.
app.js
require('./global.js');
require('./validate.js');
// require('../styles/styles.scss'); original scss that loads fine
require('./testCSS.js');
var config = require('./config/config.js');
var styles = "";
var testCss = {
testCSS: testCSS,
};
function testCSS() {
var x = GetRandomInt(1, 50);
console.log(x, config.fullFormCSSTest);
if(x < config.fullFormCSSTest){
styles = '../styles/stylesV2.scss';
console.log('new');
}else {
styles = '../styles/styles.scss';
console.log('old');
}
return styles;
}
function GetRandomInt(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
module.exports = {testCss:testCSS}; //I have tried
webpack
var prodconfig = {
entry: allEntries,
output: {
path: path.join(__dirname, "../dist/"),
filename: "static/js/[name].[hash].js"
},
module: {
rules: [
{
test: /\.scss$/,
use: ExtractTextPlugin.extract({
fallback: "style-loader",
use: [
{
loader: "css-loader",
options: { minimize: true }
},
{ loader: "sass-loader" }
]
})
},
{
test: /\.js$/,
exclude: /node_modules/,
loader: "jshint-loader"
},
{
test: /\.(png|jp(e*)g|svg)$/,
use: [
{
loader: "url-loader",
options: {
name: "static/img/[hash]-[name].[ext]"
}
},
{
test: /\.html$/,
use: [{ loader: "html-loader",
options: {minimize: true}
}]
}
]
}
]
},
resolve: {
extensions: [".js"],
alias: {
vue$: "vue/dist/vue.min.js"
}
},
plugins: [
new HtmlWebpackPlugin({
hash: true,
title: "Compare Insurance Quotes",
template: "./index.html",
chunks: ["vendor", "shared", "app"],
chunksSortMode: orderByList(["shared", "vendor", "app"]),
filename: "./index.html",
minify: htmlMinify
}),
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, "../static"),
to: path.resolve(__dirname, "../dist/static"),
ignore: [".*"]
},
{
from: path.resolve(__dirname, "../creative/creative"),
to: path.resolve(__dirname, "../dist/creative"),
ignore: [".*"]
}
]),
new ExtractTextPlugin({
filename: "css/[name].css",
disable: false,
allChunks: true
})
]
};
ожидаемый результат -> require ('../styles / styles.scss ') или require (' ../ styles / stylesV2.sccs ') в зависимости от условия загрузки и применения стилей на основе пути.testCss.js